
body, p, a{
    font-family: var(--font-regular);
}
h1, h2, h3, h4, h5{
    font-family: var(--font-header);
}
.btn.btn-primary{
    background-color: var(--primary);
    color:var(--btn-color);
    border:1px solid var(--primary);
}
.btn.btn-primary:hover, .btn.btn-primary:focus, .btn.btn-primary:active{
    background-color: var(--primary);
    color:var(--btn-color);
    border:1px solid var(--primary);
}
.btn.btn-outline-primary{
    color:var(--btn-color);
    border:1px solid var(--primary);
}
.btn.btn-outline-primary:hover{
    background-color:var(--primary);
    border:1px solid var(--primary);
    color:var(--btn-color);
}
.text-primary{
    color: var(--primary) !important;
}
.text-bg-primary{
    background-color: var(--primary) !important;
    color:var(--btn-color) !important;
}

.dashboard .btn.btn-primary:hover{
    background-color:var(--primary) !important;
}
.dashboard .btn.btn-primary:hover i, .dashboard .btn.btn-outline-primary:hover i{
    color:var(--black);
}

.bg-primary{
    background-color: var(--primary) !important;
    color:var(--btn-color) !important;
}
.track .step + .step:after{
    background-color:var(--primary);
}
.track .step:has(> button.active):before{
    background-color:var(--primary);
}
.track .step:has(~ .step button.active):before{
    background-color:var(--primary);
}
.input-group .input-group-text{
    border-color:var(--primary);
    background-color:#ffffff;
}
.set-topics .badge{
    border:1px solid var(--primary);
    background-color:#F7F7F7;
}
.set-topics .badge:hover{
    background-color:var(--primary);
}
.set-topics .badge:after{
    border-color: var(--primary);
}
.form-switch .form-check-input:checked, .form-switch .form-check-input{
    background-image:var(--toggle-circle) !important;
}
.pagination .page-item.active .page-link{
    background-color: var(--primary);
    color:var(--black) !important;
}
.form-control:focus{
    border-color: var(--primary);
}
.dt-search label:has(+ .form-control:focus){
    border-color: var(--primary);
}

@media (max-width: 991px) {
    .navbar-collapse{
        border-bottom: 2px solid var(--primary) !important;
    }
}