/* Grid */
.gap-1 {
    gap: .25rem;
}

.gap-2 {
    gap: .5rem;
}

.gap-3 {
    gap: .75rem;
}

.gap-4 {
    gap: 1rem;
}

.gap-8 {
    gap: 2rem;
}

/* Background */
.bg-dark {
    background: #333333 !important;
}

/* Border */
.border-dashed {
    border-style: dashed;
}

/* Button */
.btn {
    display: inline-flex;
    align-items: center;
    
    padding: .4rem 1rem;
}

.btn i {
    color: inherit;
}

.btn i {
    padding: 0;
}

.btn-dimmed {
    color: #0112224D;
    
    background-color: #FAFAFA;
    border-color: #0112224D;
}

.hover\:primary:hover {
    color: #FFFFFF;
    
    background-color: #EA4544;
    border-color: #EA4544;
}

/* Input */
.form-control {
    height: calc(1.5em + .8rem + 2px);
    padding: .4rem 1rem;
}

.custom-select {
    height: calc(1.5em + .8rem + 2px);
    padding: .4rem 1rem;
}

.checkbox>span {
    background: transparent;
    border: 1px solid #D9D9D9;
    border-radius: 4px;
}

.checkbox>input:disabled~span {
    background: #D9D9D9;
    cursor: no-drop;
}

.checkbox>input:checked~span {
    background-color: transparent;
    border-color: #EA4544;
}

.checkbox>input:checked~span:after {
    border-color: #EA4544;
}

/* Banner */
.section--banner {
    background: url(/images/banner-bg.png) no-repeat bottom right;
}

/* Main */
#main {
    min-height: calc( 100vh - 58px - 105px );
}

/* Option */
.option .option-control {
    display: none;
}

.option .option-label .option-head .option-title {
    font-size: 20px;
    font-weight: 700;
    
    color: #EA4544;
}

.option .option-label .option-body {
    font-size: 1rem;
}

.option.selected {
    border-color: #EA4544;
}

/* Pagination */
.pagination {
    margin: 0;
    
    gap: 0.5rem;
}

.page-item .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    
    padding: 0;
    width: 24px;
    height: 24px;
    
    font-size: 14px;
    line-height: 0;
    
    cursor: pointer;
    
    color: #01122280;
    background: transparent !important;
    border: 0;
}

.page-item.active .page-link {
    color: #22313F;
    background: #0112221A !important;
}

/* Overlay */
.mod-bar {
    z-index: 999;
}