:root {
    --bg-primary: #0278ae;
    --bg-secondary: #51adcf;
    --bg-tertiary: #a5ecd7;
    --text-color: #213e3b;
}

html,
body {
    height: 100%;
    font-family: 'Noto Sans SC', sans-serif;
    font-size: 14px;
}

body {
    margin-top: 50px;
}

.bg-primary, .label-primary {
    background-color: var(--primary) !important;
}

.form-horizontal .form-group .control-label{
    text-align: right;
    padding-top: 7px;
}

.has-error .help-block, .has-error .control-label, .has-error .radio, .has-error .checkbox, .has-error .radio-inline, .has-error .checkbox-inline, .has-error.radio label, .has-error.checkbox label, .has-error.radio-inline label, .has-error.checkbox-inline label {
    color: #a94442;
}

.has-error .form-control {
    border-color: #a94442;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.has-success .help-block, .has-success .control-label, .has-success .radio, .has-success .checkbox, .has-success .radio-inline, .has-success .checkbox-inline, .has-success.radio label, .has-success.checkbox label, .has-success.radio-inline label, .has-success.checkbox-inline label {
    color: #3c763d;
}

.has-success .form-control {
    border-color: #3c763d;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.primary-btn{
    background-color: #005E57; 
    border: #005E57; 
}

.card-info:not(.card-outline) .card-header {
    background-color: #005E57;
}

.main-header {
    z-index: 1 !important;
}

.main-sidebar {
    z-index: 2 !important;
    background: var(--primary);
}

.nav-sidebar .nav-link.active {
    background: var(--bg-secondary) !important;
}

.nav-sidebar .nav-item:hover {
    background: transparent;
}

.nav-sidebar .nav-item:hover .nav-link, .nav-link:hover {
    background: var(--bg-secondary) !important;
}

@media (min-width: 992px) {
    .modal-xl {
        max-width: 800px;
    }
}

@media (min-width: 1200px) {
    .modal-xl {
        max-width: 1000px;
    }
}

@media (min-width: 1400px) {
    .modal-xl {
        max-width: 1200px;
    }
}