:root {
    --ev-bg: #f4f6f8;
    --ev-surface: #ffffff;
    --ev-surface-muted: #f8fafc;
    --ev-border: #d9e1ea;
    --ev-border-strong: #b8c5d3;
    --ev-text: #182330;
    --ev-text-muted: #607086;
    --ev-primary: #1769aa;
    --ev-primary-strong: #0d4f86;
    --ev-primary-soft: #e8f2fb;
    --ev-success: #2e7d50;
    --ev-danger: #b73a48;
    --ev-warning: #b7791f;
    --ev-shadow: 0 10px 30px rgba(20, 32, 46, 0.10);
    --ev-radius: 6px;
    --ev-control-height: 36px;
}

html,
body {
    background: var(--ev-bg);
    color: var(--ev-text);
}

#container {
    background: var(--ev-bg);
}

#navbar,
#navbar-container {
    background: var(--ev-surface) !important;
    border-bottom: 1px solid var(--ev-border);
    box-shadow: 0 1px 12px rgba(20, 32, 46, 0.06);
}

#navbar .navbar-content,
#navbar .navbar-top-links > li > a,
#navbar .username,
#app_title {
    color: var(--ev-text) !important;
}

#app_title {
    font-weight: 600 !important;
    letter-spacing: 0;
}

#app_logo {
    filter: none !important;
    padding: 12px !important;
}

#mainnav-container,
#mainnav {
    background: #102033 !important;
}

#mainnav-menu-wrap .nano-content {
    background: #102033;
}

#mainnav-menu > .list-header {
    color: #9fb1c6;
    font-weight: 700;
    letter-spacing: 0;
    padding: 14px 18px 8px;
}

#mainnav-menu a {
    color: #dce7f2 !important;
    border-radius: var(--ev-radius);
    margin: 1px 8px;
}

#mainnav-menu a:hover,
#mainnav-menu li.active > a,
#mainnav-menu ul.collapse > li > a:hover {
    background: rgba(255, 255, 255, 0.10) !important;
    color: #ffffff !important;
}

#mainnav-menu a i,
#profile-nav a i,
#instance-nav a i {
    color: #8dc6ff;
}

.mainnav-profile {
    background: rgba(255, 255, 255, 0.04) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.mainnav-profile .mnp-name,
.mainnav-profile .mnp-desc {
    color: #edf5ff !important;
}

#content-container {
    background: var(--ev-bg);
}

#page-content {
    padding: 12px !important;
}

#fullscreen > div:first-child {
    background: var(--ev-surface);
    border: 1px solid var(--ev-border);
    border-radius: var(--ev-radius);
    box-shadow: 0 1px 2px rgba(20, 32, 46, 0.04);
    margin-bottom: 10px;
}

.panel,
.modal-content,
.tab-content,
.dropdown-menu {
    border: 1px solid var(--ev-border) !important;
    border-radius: var(--ev-radius) !important;
    box-shadow: var(--ev-shadow);
}

.panel-heading,
.modal-header {
    background: var(--ev-surface-muted) !important;
    border-bottom: 1px solid var(--ev-border) !important;
}

.panel-title,
.modal-title {
    color: var(--ev-text);
    font-weight: 700;
}

.modal-footer {
    background: var(--ev-surface-muted);
    border-top: 1px solid var(--ev-border) !important;
}

.nav-tabs {
    border-bottom: 1px solid var(--ev-border);
}

.nav-tabs > li > a {
    border-radius: var(--ev-radius) var(--ev-radius) 0 0;
    color: var(--ev-text-muted);
    font-weight: 600;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: var(--ev-primary);
    border-color: var(--ev-border) var(--ev-border) var(--ev-surface);
}

label.text-primary,
.text-primary {
    color: var(--ev-primary) !important;
}

label.text-primary {
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 4px;
}

.form-control,
.select2-container .select2-selection--single,
.bootstrap-select > .dropdown-toggle {
    min-height: var(--ev-control-height);
    border: 1px solid var(--ev-border-strong) !important;
    border-radius: var(--ev-radius) !important;
    background-color: var(--ev-surface) !important;
    color: var(--ev-text) !important;
    box-shadow: none !important;
}

.form-control:focus,
.select2-container--focus .select2-selection,
.bootstrap-select.open > .dropdown-toggle {
    border-color: var(--ev-primary) !important;
    box-shadow: 0 0 0 3px rgba(23, 105, 170, 0.14) !important;
}

.form-control[readonly],
.form-control[disabled],
fieldset[disabled] .form-control {
    background-color: var(--ev-surface-muted) !important;
    color: var(--ev-text-muted) !important;
}

.btn {
    border-radius: var(--ev-radius) !important;
    font-weight: 700;
    border-width: 1px;
    box-shadow: none !important;
}

.btn-icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
}

.btn-primary,
.btn-info,
.btn-mint {
    background-color: var(--ev-primary) !important;
    border-color: var(--ev-primary-strong) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-info:hover,
.btn-mint:hover {
    background-color: var(--ev-primary-strong) !important;
}

.btn-default {
    background-color: var(--ev-surface) !important;
    border-color: var(--ev-border-strong) !important;
    color: var(--ev-text) !important;
}

.btn-danger {
    background-color: var(--ev-danger) !important;
    border-color: #9f2e3b !important;
    color: #ffffff !important;
}

.btn-success {
    background-color: var(--ev-success) !important;
    border-color: #24653f !important;
    color: #ffffff !important;
}

.btn-warning {
    background-color: var(--ev-warning) !important;
    border-color: #976318 !important;
    color: #ffffff !important;
}

.GreenText {
    color: var(--ev-success) !important;
    border-color: var(--ev-success) !important;
}

.RedText {
    color: var(--ev-danger) !important;
    border-color: var(--ev-danger) !important;
}

.BlueText {
    color: var(--ev-primary) !important;
    border-color: var(--ev-primary) !important;
}

.select2-dropdown,
.dropdown-menu {
    border-color: var(--ev-border) !important;
}

.select2-results__option--highlighted {
    background: var(--ev-primary-soft) !important;
    color: var(--ev-primary-strong) !important;
}

.grd2023-grid {
    background: var(--ev-surface) !important;
    border: 1px solid var(--ev-border) !important;
    border-radius: var(--ev-radius);
    color: var(--ev-text) !important;
    box-shadow: 0 1px 2px rgba(20, 32, 46, 0.05);
}

.grd2023-titles {
    background: #17324d !important;
    color: #ffffff !important;
    padding-top: 0 !important;
    border-bottom: 1px solid #0e2238;
}

.grd2023-titles > div {
    padding: 11px 10px !important;
    font-size: 12px;
    font-weight: 800;
}

.grd2023-datarow {
    color: var(--ev-text) !important;
    border-bottom: 1px solid var(--ev-border) !important;
}

.grd2023-datarow:nth-child(even) {
    background: #fbfcfe !important;
}

.grd2023-datarow:nth-child(odd) {
    background: var(--ev-surface) !important;
}

div.grd2023-datarow:hover {
    background: var(--ev-primary-soft) !important;
}

div.grd2023-datarow[grd2023-selected="true"] {
    background: #d8eafa !important;
    box-shadow: inset 3px 0 0 var(--ev-primary);
}

.grd2023-datarow > div {
    padding: 9px 10px !important;
}

div.grd2023-footer {
    background: var(--ev-surface-muted) !important;
    color: var(--ev-text-muted) !important;
    border-top: 1px solid var(--ev-border);
    font-weight: 700 !important;
}

.e-grid,
.e-grid .e-gridheader,
.e-grid .e-headercell,
.e-grid .e-rowcell {
    border-color: var(--ev-border) !important;
}

.e-grid .e-gridheader {
    background: #17324d !important;
    color: #ffffff !important;
}

#footer {
    background: var(--ev-surface) !important;
    border-top: 1px solid var(--ev-border);
    color: var(--ev-text-muted);
}

.validationerror {
    color: var(--ev-danger) !important;
}

@media (max-width: 700px) {
    #page-content {
        padding: 8px !important;
    }

    .modal-dialog {
        margin: 8px !important;
        width: calc(100% - 16px) !important;
    }

    #fullscreen > div:first-child {
        margin: 0 0 8px;
    }
}

@media print {
    #navbar,
    #mainnav-container,
    #footer {
        display: none !important;
    }

    .grd2023-grid {
        box-shadow: none;
        border-color: #000 !important;
    }
}
