:root {
    --app-page-bg: #f8f9fa;
    --app-surface: #ffffff;
    --app-raised-surface: #f8f9fa;
    --bs-primary: #3973c6;
    --bs-primary-rgb: 57, 115, 198;
    --bs-primary-text-emphasis: #1b3b67;
    --bs-primary-bg-subtle: #e1ebf8;
    --bs-primary-border-subtle: #aec7e8;
    --bs-link-color: #3973c6;
    --bs-link-color-rgb: 57, 115, 198;
    --bs-link-hover-color: #2f61a8;
    --bs-link-hover-color-rgb: 47, 97, 168;
    --bs-focus-ring-color: rgba(57, 115, 198, 0.25);
}

html[data-bs-theme="dark"] {
    color-scheme: dark;
    --app-page-bg: #121820;
    --app-surface: #212a35;
    --app-raised-surface: #283340;
    --bs-body-bg: var(--app-page-bg);
    --bs-body-color: #e2e8f0;
    --bs-secondary-bg: var(--app-surface);
    --bs-tertiary-bg: var(--app-raised-surface);
    --bs-border-color: #3a4654;
}

html[data-bs-theme="dark"] .bg-white,
html[data-bs-theme="dark"] .bg-light,
html[data-bs-theme="dark"] .modal-footer.bg-light {
    background-color: var(--app-raised-surface) !important;
}

html[data-bs-theme="dark"] .bg-white .text-white,
html[data-bs-theme="dark"] .bg-light .text-white {
    color: #212529 !important;
}

html[data-bs-theme="dark"] .table-light,
html[data-bs-theme="dark"] .table-light > :not(caption) > * > * {
    --bs-table-color: #212529;
    --bs-table-bg: #e2e3e5;
    --bs-table-striped-color: #212529;
    --bs-table-striped-bg: #d5d7da;
    color: #212529 !important;
}

html[data-bs-theme="dark"] .text-dark {
    color: var(--bs-body-color) !important;
}

html[data-bs-theme] body .navbar {
    background-color: var(--app-surface) !important;
}

html[data-bs-theme="dark"] body,
html[data-bs-theme="dark"] body .navbar,
html[data-bs-theme="dark"] body .navbar-brand,
html[data-bs-theme="dark"] body .navbar .nav-link {
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .card {
    --bs-card-bg: var(--app-surface);
    --bs-card-border-color: var(--bs-border-color);
    color: var(--bs-body-color);
    background-color: var(--app-surface) !important;
}

html[data-bs-theme="dark"] .card-body:not([class*="bg-"]),
html[data-bs-theme="dark"] .card-header:not([class*="bg-"]),
html[data-bs-theme="dark"] .card-footer:not([class*="bg-"]) {
    background-color: var(--app-surface) !important;
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .card-body.bg-light,
html[data-bs-theme="dark"] .card-body.bg-white,
html[data-bs-theme="dark"] .card-header.bg-light,
html[data-bs-theme="dark"] .card-header.bg-white,
html[data-bs-theme="dark"] .card-footer.bg-light,
html[data-bs-theme="dark"] .card-footer.bg-white {
    background-color: var(--app-raised-surface) !important;
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .card-header,
html[data-bs-theme="dark"] .card-footer {
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] body footer {
    color: #cbd5e1 !important;
    background-color: var(--app-surface) !important;
    border-color: var(--bs-border-color) !important;
}

html[data-bs-theme="dark"] body footer.bg-light .text-muted,
html[data-bs-theme="dark"] body footer.bg-light .text-body-secondary {
    color: #cbd5e1 !important;
}

html[data-bs-theme="dark"] body footer.bg-light .text-dark,
html[data-bs-theme="dark"] body footer.bg-light h1,
html[data-bs-theme="dark"] body footer.bg-light h2,
html[data-bs-theme="dark"] body footer.bg-light h3,
html[data-bs-theme="dark"] body footer.bg-light h4,
html[data-bs-theme="dark"] body footer.bg-light h5,
html[data-bs-theme="dark"] body footer.bg-light h6 {
    color: #f1f5f9 !important;
}

html[data-bs-theme="dark"] .qar-table thead th {
    color: #212529 !important;
}

html[data-bs-theme="dark"] .qar-table .calculated,
html[data-bs-theme="dark"] .qar-table .calculated td,
html[data-bs-theme="dark"] .qar-table .calculated th {
    color: #212529 !important;
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #2f61a8;
    --bs-btn-hover-border-color: #2c5b9e;
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #2c5b9e;
    --bs-btn-active-border-color: #295596;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-disabled-color: var(--bs-primary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-link {
    --bs-btn-color: var(--bs-link-color);
    --bs-btn-hover-color: var(--bs-link-hover-color);
}

.form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.list-group-item.active {
    color: #fff;
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link,
.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--bs-primary);
}