.theme-toggle-btn {
    align-items: center;
    background: transparent;
    border: 0;
    color: #194355;
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 35px;
    height: 35px;
    justify-content: center;
    margin-right: 8px;
    padding: 0;
    width: 35px;
}

.theme-toggle-btn:hover {
    opacity: 0.75;
}

.theme-toggle-btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

html.dark-mode {
    background: #111820;
    color-scheme: dark;
    --baseBlack: 231, 237, 242;
    --black: #e7edf2;
    --black2: #d9e1e7;
    --black3: #cbd5dc;
    --black4: #bdc9d1;
    --black5: #b0bdc7;
    --black6: #a4b2bd;
    --black7: #96a6b2;
}

html.dark-mode body {
    background-color: #111820 !important;
    color: #e7edf2;
}

html.dark-mode .main-container,
html.dark-mode main,
html.dark-mode #main-content,
html.dark-mode .main-content,
html.dark-mode .content-section,
html.dark-mode .app-header__main,
html.dark-mode .app-header__top {
    background-color: #111820;
    color: #e7edf2;
}

html.dark-mode .app-header__top {
    border-color: #34414b;
}

html.dark-mode .emblem-icon img {
    filter: brightness(0) invert(1);
}

html.dark-mode .main-container :is(h1, h2, h3, h4, h5, h6, p, li, dt, dd, label, td, th, figcaption) {
    color: #e7edf2;
}

html.dark-mode .main-container a:not(.app-navigation__item) {
    color: #a9d2ff;
}

html.dark-mode .main-container a:not(.app-navigation__item):hover {
    color: #d3e8ff;
}

html.dark-mode .app-header__top .links,
html.dark-mode .app-header__top .nav-only a,
html.dark-mode .app-header_main_logo-text > span,
html.dark-mode .app-header__top__info,
html.dark-mode footer,
html.dark-mode footer :is(p, span, li, strong, small),
html.dark-mode main :is(h1, h2, h3, h4, h5, h6, p, li, dt, dd, label, td, th, figcaption),
html.dark-mode #main-content :is(h1, h2, h3, h4, h5, h6, p, li, dt, dd, label, td, th, figcaption),
html.dark-mode .main-content :is(h1, h2, h3, h4, h5, h6, p, li, dt, dd, label, td, th, figcaption) {
    color: #e7edf2;
}

html.dark-mode main a,
html.dark-mode #main-content a,
html.dark-mode .main-content a,
html.dark-mode footer a {
    color: #a9d2ff;
}

html.dark-mode main a:hover,
html.dark-mode #main-content a:hover,
html.dark-mode .main-content a:hover,
html.dark-mode footer a:hover {
    color: #d3e8ff;
}

html.dark-mode :is(.card, .modal-content, .accordion-item, .list-group-item, .popover, .tooltip-inner, .alert-light, .bg-white, .bg-light, .panel, .well, .tab-content) {
    background-color: #1b252e !important;
    border-color: #3a4853 !important;
    color: #e7edf2;
}

html.dark-mode :is(.card, .modal-content, .accordion-item, .list-group-item, .panel, .well, .tab-content) :is(h1, h2, h3, h4, h5, h6, p, li, label, span, strong, small) {
    color: inherit;
}

html.dark-mode :is(.modal-header, .modal-footer, .card-header, .card-footer, .accordion-button, .list-group-item, .panel-heading, .panel-footer) {
    border-color: #3a4853 !important;
}

html.dark-mode .accordion-button {
    background-color: #1b252e;
    color: #e7edf2;
}

html.dark-mode :is(.dropdown-menu, .app-navigation__grid) {
    background-color: #1b252e !important;
    border-color: #3a4853 !important;
}

html.dark-mode .dropdown-item,
html.dark-mode .app-navigation__grid .app-navigation__item {
    color: #e7edf2 !important;
}

html.dark-mode .dropdown-item:hover,
html.dark-mode .dropdown-item:focus,
html.dark-mode .app-navigation__grid .app-navigation__item:hover {
    background-color: #2a3944 !important;
    color: #ffffff !important;
}

html.dark-mode :is(input, select, textarea, .form-control, .custom-select) {
    background-color: #182129 !important;
    border-color: #4a5965 !important;
    color: #e7edf2 !important;
}

html.dark-mode :is(input, select, textarea, .form-control)::placeholder {
    color: #aab7c1 !important;
    opacity: 1;
}

html.dark-mode input[type="checkbox"],
html.dark-mode input[type="radio"] {
    accent-color: #8dbfff;
}

html.dark-mode :is(table, .table) {
    color: #e7edf2;
}

html.dark-mode :is(table, .table) > :not(caption) > * > * {
    background-color: #172129;
    border-color: #3a4853;
    color: #e7edf2;
}

html.dark-mode :is(.table-striped, table.table-striped) > tbody > tr:nth-of-type(odd) > * {
    background-color: #202b34;
}

html.dark-mode :is(hr, .border, .border-top, .border-bottom) {
    border-color: #3a4853 !important;
}

html.dark-mode .text-dark,
html.dark-mode .text-muted {
    color: #c2cbd2 !important;
}

html.dark-mode .page-link,
html.dark-mode .btn-light,
html.dark-mode .btn-default {
    background-color: #1b252e;
    border-color: #3a4853;
    color: #e7edf2;
}

html.dark-mode .theme-toggle-btn {
    color: #ffd166;
}

html.dark-mode .app-navigation__main {
    color: #ffffff;
}



