body {
    color: #212529;
}

body.dark-mode {
    background-color: #121212 !important;
    color: #e6e6e6 !important;
}

body.dark-mode.bg-light {
    background-color: #121212 !important;
}

.dark-mode .navbar {
    background-color: #1f2a38 !important;
}

.dark-mode .navbar .navbar-brand,
.dark-mode .navbar .nav-link,
.dark-mode .navbar .navbar-nav .nav-link {
    color: #ddd !important;
}

.dark-mode h1, .dark-mode h2, .dark-mode h3, .dark-mode h4, .dark-mode h5, .dark-mode h6 {
    color: #e6e6e6;
}

.dark-mode .text-dark {
    color: #e6e6e6 !important;
}

.dark-mode .text-body {
    color: #e6e6e6 !important;
}

.dark-mode .text-muted {
    color: #aaa !important;
}

.dark-mode .card {
    background-color: #1e1e1e;
    border-color: #333;
    color: #e6e6e6;
}

.dark-mode .card-header {
    background-color: #1e1e1e;
    border-color: #333;
}

.dark-mode .card-body {
    background-color: #1e1e1e;
}

.dark-mode .modal-content {
    background-color: #1e1e1e;
    color: #e6e6e6;
}

.dark-mode .modal-header {
    border-bottom-color: #333;
}

.dark-mode .modal-footer {
    border-top-color: #333;
}

.dark-mode .modal-title {
    color: #e6e6e6;
}

.dark-mode .form-label {
    color: #ccc;
}

.dark-mode .form-control {
    background-color: #2a2a2a;
    border-color: #444;
    color: #e6e6e6;
}

.dark-mode .form-control:focus {
    background-color: #333;
    border-color: #007bff;
    color: #fff;
}

.dark-mode .form-check-label {
    color: #ccc;
}

.dark-mode .btn-primary {
    background-color: #007bff;
    border-color: #007bff;
    color: #fff;
}

.dark-mode .btn-outline-primary {
    color: #6ea8fe;
    border-color: #6ea8fe;
}

.dark-mode .btn-outline-primary:hover {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: #fff;
}

.dark-mode .btn-secondary {
    background-color: #444;
    border-color: #555;
    color: #e6e6e6;
}

.dark-mode .btn-secondary:hover {
    background-color: #555;
    border-color: #666;
    color: #fff;
}

.dark-mode .bg-light {
    background-color: #1a1a2e !important;
}

.dark-mode .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

.dark-mode .nav-link {
    color: #ddd !important;
}

html, body, .navbar, .btn, .nav-link {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* Dark mode overrides for white backgrounds that make text invisible */
.dark-mode .bg-white {
    background-color: #1e1e1e !important;
}

.dark-mode .bg-white .text-muted,
.dark-mode .bg-white .text-dark,
.dark-mode .bg-white .text-body {
    color: #e6e6e6 !important;
}

.dark-mode .bg-white .card-title,
.dark-mode .bg-white .card-text,
.dark-mode .bg-white h1,
.dark-mode .bg-white h2,
.dark-mode .bg-white h3,
.dark-mode .bg-white h4,
.dark-mode .bg-white h5,
.dark-mode .bg-white h6,
.dark-mode .bg-white p,
.dark-mode .bg-white li,
.dark-mode .bg-white span:not(.badge) {
    color: #e6e6e6 !important;
}

.dark-mode .list-group-item.bg-white {
    background-color: #2a2a2a !important;
    color: #e6e6e6 !important;
    border-color: #444 !important;
}

.dark-mode .bg-white.bg-opacity-25 {
    background-color: rgba(0, 0, 0, 0.4) !important;
}

.dark-mode .text-muted {
    color: #aaa !important;
}

.dark-mode .shadow-sm {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.4) !important;
}

/* Dark mode overrides for Bootstrap accordion (FAQ page) */
.dark-mode .accordion {
    --bs-accordion-bg: #1e1e1e;
    --bs-accordion-color: #e6e6e6;
    --bs-accordion-border-color: #444;
    --bs-accordion-btn-bg: #1e1e1e;
    --bs-accordion-btn-color: #e6e6e6;
    --bs-accordion-btn-focus-border-color: #444;
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-accordion-active-bg: #2a2a2a;
    --bs-accordion-active-color: #6ea8fe;
    --bs-accordion-body-padding-x: 1.25rem;
    --bs-accordion-body-padding-y: 1rem;
}

.dark-mode .accordion-item {
    background-color: #1e1e1e;
    border-color: #444;
    color: #e6e6e6;
}

.dark-mode .accordion-button {
    background-color: #1e1e1e;
    color: #e6e6e6;
}

.dark-mode .accordion-button:not(.collapsed) {
    background-color: #2a2a2a;
    color: #6ea8fe;
    box-shadow: inset 0 -1px 0 #444;
}

.dark-mode .accordion-button::after {
    filter: invert(1) grayscale(100%) brightness(200%);
}

.dark-mode .accordion-body {
    background-color: #1e1e1e;
    color: #e6e6e6;
}

.dark-mode .accordion-button:focus {
    border-color: #444;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.dark-mode .accordion-button:hover {
    background-color: #2a2a2a;
}