:root{
    --primary-color: #836650;
    --primary-bg-color: #83665007;
    --primary-dark-color: #512a0f;
    --accent-color: #bba99c;
    --text-color: #333333;
}
body{
    font-size: 16px !important;
    min-height: 800px;
    color: var(--text-color);
    font-family: 'Fira Sans', sans-serif;
    /* background: #83665010; */
    background: #FEFEFE;
}

a {
    color: var(--primary-color);
    text-decoration: underline;
}
a:hover {
    color: var(--primary-color);
}


.container-wrapper{
    width: 1400px;
    margin-right: auto;
    margin-left: auto;
}
@media (min-width: 1405px) {
    .container-fluid{
        width: 1400px;
    }
}

.page-title{
    font-size: 1.6rem;
    margin-bottom: 2em;
}
h2, h3{
    margin-bottom: 1em;
}
@media only screen and (max-width: 600px) {
    .page-title{
        font-size: 1.2rem;
    }
}

@media screen and (max-width: 400px){
    .site-logo {
        max-width: 200px;
    }
}

.text-primary{
    color: var(--primary-color) !important;
}
/* nav */
.navbar{
    background-color: #FFFFFF;
}
.nav-link{
    margin-bottom: 4px;
    color: var(--primary-color);
}
.nav-link:hover{
    color: var(--primary-color);
}

.navbar-toggler{
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.navbar-toggler-icon{
    width: 1em;
    height: 1.1em;
}

/* Paginator */
.page-link {
    color: var(--primary-color);
    border-color: var(--primary-color);
}
.page-item.active .page-link {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Form */
.form-group{
    margin-bottom: 1em;
}

.btn-primary {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.btn-primary:hover {
    background-color: var(--primary-dark-color);
    border-color: var(--primary-dark-color);
}
.field{
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.25rem;
}

/* input[type="date"]
{
    display:block;
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    min-height: 1.2em;
    width: 95%;
} */

/* Widget */
.widget, .card {
    background-color: var(--primary-bg-color);
}
.widget .card-header{
    font-weight: bold;
    color: var(--primary-color);
    border: 0;
    background-color: transparent;
}
.widget .card-body{
    padding: 0.5rem 0.5rem;
}
.widget .card-footer{
    background-color: transparent;
    margin: 0 0.5rem;
    padding: 0.5rem 0.5rem;
}

.badge-primary{
    background-color: var(--primary-color);
}
.widget .list-group-flush{

}
.card .list-group-flush>.list-group-item{
    border: 0;
    background-color: transparent;
}

/* Track */
.status-P, .status-5, .status-A1, .status-P:hover, .status-5:hover, .status-A1:hover{
    background-color: #00b050;
    border-color: #00b050;
    color: #FFFFFF;
}
.status-C, .status-4, .status-A2, .status-C:hover, .status-4:hover, .status-A2:hover{
    background-color: #92d050;
    border-color: #92d050;
    color: #FFFFFF;
}
.status-T, .status-3, .status-T:hover, .status-3:hover{
    background-color: #a6a6a6;
    border-color: #a6a6a6;
    color: #FFFFFF;
}
.status-R, .status-2, .status-A3, .status-R:hover, .status-2:hover, .status-A3:hover{
    background-color: #ff6600;
    border-color: #ff6600;
    color: #FFFFFF;
}
.status-D, .status-1, .status-D:hover, .status-1:hover{
    background-color: #ff0000;
    border-color: #ff0000;
    color: #FFFFFF;
}
.status-Out:hover{
    color: #6c757d;
    border-color: #6c757d;
    background-color: #FFF;
}
.btn-check:checked+.btn-outline-secondary{
    color: #6c757d;
    background-color: #FFF;
    border-color: #6c757d;
}
.btn-check:checked+.btn-outline-secondary:after{
    content: "✓";
    font-size: 10px;
    color: var(--bs-success);
}


.text-status-P, .text-status-5, .text-status-A1{
    color: #00b050;
}
.text-status-C, .text-status-4, .text-status-A2{
    color: #92d050;
}
.text-status-T, .text-status-3{
    color: #a6a6a6;
}
.text-status-R, .text-status-2{
    color: #ff6600;
}
.text-status-D, .text-status-1, .text-status-A3{
    color: #ff0000;
}

.track-fields label{
    font-size: 16px;
    padding: 10px 18px;
    margin-top: 4px;
}
.track-fields label.status-Out{
    padding: 10px 12px;
}
@media screen and (min-width: 500px) {
    .track-fields label{
        font-size: 18px;
        padding: 12px 24px;
        margin-top: 4px;
    }
    .track-fields label.status-Out{
        padding: 12px 24px;
    }
}
/* .track-fields .btn-check:active+.btn-outline-secondary, .track-fields .btn-outline-secondary:active{
    background-color: transparent !important;
    border-color: transparent !important;
} */

.crc-section, .sic-section{
    border: 2px solid #000000 !important;
}
.crc-section details, .sic-section details{
    border-top: 1px solid #000000 !important;
}
.under20Mins {
    color: #dc3545;
}
.blink {
    animation: blink-animation 1s steps(5, start) infinite;
    -webkit-animation: blink-animation 1s steps(5, start) infinite;
}
@keyframes blink-animation {
    to {
        color: #000000;
    }
}
@-webkit-keyframes blink-animation {
    to {
        color: #000000;
    }
}
/* Chart */
/* .c3-chart-text text 
{
    font-family: 'Fira Sans', sans-serif;
} */

/* .triggerFade {
    opacity: 0;
    transition: opacity 1s ease-out;
} */

.no-disc{
    list-style-type: none;
}
.no-deco{
    text-decoration: none !important;
}

.border-primary {
    border-color: var(--primary-color) !important;
}
.border-secondary {
    border-color: var(--primary-dark-color) !important;
}

.btn-primary.disabled, .btn-primary:disabled{
    color: #333333;
    background-color: #aaaaaa;
    border-color: #aaaaaa;
}