/* ================================
   Helios – Dark mode (C1)
   ================================ */

/* Dark mode adjustments for Orbit language switcher */
[data-theme="dark"] .orbit-language-switch .orbit-flag {
    background: #1f2937;
    /* dark neutral, Orbit-like */
    box-shadow: 0 1px 3px rgba(0, 0, 0, .6);
}

[data-theme="dark"] .orbit-language-switch .dropdown-menu {
    background-color: #1f2937;
    border-color: rgba(255, 255, 255, .08);
}

[data-theme="dark"] .orbit-language-switch .dropdown-item {
    color: #e5e7eb;
}

[data-theme="dark"] .orbit-language-switch .dropdown-item:hover,
[data-theme="dark"] .orbit-language-switch .dropdown-item:focus {
    background-color: rgba(255, 255, 255, .06);
    color: #ffffff;
}

/* Dark mode tweaks */
[data-theme="dark"] .auth-helper {
    color: #9ca3af;
}

/* Dark mode */
[data-theme="dark"] .orbit-divider {
    color: #9ca3af;
}

[data-theme="dark"] .orbit-divider::before,
[data-theme="dark"] .orbit-divider::after {
    border-color: rgba(255, 255, 255, .12);
}

/* Force dark */
html[data-theme="dark"] {
    color-scheme: dark;
}

html[data-theme="dark"],
html[data-theme="auto"] {
    --helios-blue: #5f8fb3;
    --helios-blue-strong: #7aa7c7;
    --helios-blue-muted: rgba(95, 143, 179, 0.6);
    --helios-bg-main: #0f1720;
    --helios-bg-panel: #141d27;
    --helios-bg-panel-soft: #101824;
    --helios-border-subtle: #1f2937;
    --bs-tertiary-bg: #141d27;
    --bs-secondary-bg: #111a24;
    --bs-body-bg: #0f1720;
    --helios-blue-deep: #223f67;
    --helios-blue-deep-soft: #1e2f4d;
    --helios-blue-deep-border: #2a4166;
}

/* Ensure full-page dark background (prevent white bleed) */
html[data-theme="dark"] {
    background-color: #0f1720;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] {
        background-color: #0f1720;
    }
}

html[data-theme="dark"] body {
    background-color: #0f1720;
    color: #e6eaf0;
    min-height: 100vh;
}

html[data-theme="dark"] .helios-logo {
    content: url("/assets/img/logo_orbit_dark.webp");
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .helios-logo {
        content: url("/assets/img/logo_orbit_dark.webp");
    }
}

html[data-theme="dark"] a {
    color: var(--helios-blue);
}

html[data-theme="dark"] a:hover {
    color: var(--helios-blue-strong);
}

/* Auto dark (OS preference) */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] {
        color-scheme: dark;
    }

    html[data-theme="auto"] body {
        background-color: #0f1720;
        color: #e6eaf0;
        min-height: 100vh;
    }

    html[data-theme="auto"] a {
        color: var(--helios-blue);
    }

    html[data-theme="auto"] a:hover {
        color: var(--helios-blue-strong);
    }
}

/* ================================
   Helios – Dark mode (C2)
   Cards / modals / dropdowns
   ================================ */

/* -------------------------------------------
   Nav tabs / pills — Dark mode
------------------------------------------- */

[data-theme="dark"] .nav-tabs,
[data-theme="dark"] .nav-pills {
    border-color: rgba(255, 255, 255, 0.08);
}

/* Tab buttons */
[data-theme="dark"] .nav-tabs .nav-link,
[data-theme="dark"] .nav-pills .nav-link {
    color: rgba(255, 255, 255, 0.75);
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

/* Hover */
[data-theme="dark"] .nav-tabs .nav-link:hover,
[data-theme="dark"] .nav-pills .nav-link:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.12);
}

/* Active tab */
[data-theme="dark"] .nav-tabs .nav-link.active,
[data-theme="dark"] .nav-pills .nav-link.active {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.18);
}

/* Disabled */
[data-theme="dark"] .nav-tabs .nav-link.disabled,
[data-theme="dark"] .nav-pills .nav-link.disabled {
    color: rgba(255, 255, 255, 0.35);
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.05);
}

/* ========== Cards ========== */
html[data-theme="dark"] .card {
    background-color: #151e28;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e6eaf0;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .card {
        background-color: #151e28;
        border-color: rgba(255, 255, 255, 0.08);
        color: #e6eaf0;
    }
}

html[data-theme="dark"] #sidebar .helios-segmented .btn {
    background-color: transparent;
    color: rgba(230, 234, 240, 0.7);
    border-color: var(--helios-border-subtle);
}

html[data-theme="dark"] #sidebar .helios-segmented .btn.is-selected {
    background-color: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.28);
    font-weight: 600;
}

html[data-theme="dark"] #sidebar .helios-segmented .btn:not(.is-selected):hover {
    background-color: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

/* Card header & footer */
html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer {
    background-color: #131b24;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e6eaf0;
}

/* Card header with bg-primary – neutralize in dark mode */
html[data-theme="dark"] .card-header.bg-primary {
    background-color: #131b24 !important;
    color: #e6eaf0 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .card-header,
    html[data-theme="auto"] .card-footer {
        background-color: #131b24;
        border-color: rgba(255, 255, 255, 0.08);
        color: #e6eaf0;
    }

    html[data-theme="auto"] .card-header.bg-primary {
        background-color: #131b24 !important;
        color: #e6eaf0 !important;
        border-color: rgba(255, 255, 255, 0.08) !important;
    }
}

/* Dark mode – bg-secondary-subtle */
[data-theme="dark"] .bg-secondary-subtle {
    background-color: rgba(255, 255, 255, 0.06) !important;
    color: var(--bs-body-color);
}

/* ========== Modals ========== */
html[data-theme="dark"] .modal-content {
    background-color: #151e28;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e6eaf0;
}

/* Mobile table cards */
html[data-theme="dark"] .orbit-table-mobile tbody tr {
    background: #1b2330;
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .orbit-table-mobile tbody tr:nth-child(even) {
    background: #1f2836;
}

html[data-theme="dark"] .orbit-table-mobile tbody td[data-label]::before {
    color: rgba(230, 234, 240, 0.7);
}


@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .modal-content {
        background-color: #151e28;
        border-color: rgba(255, 255, 255, 0.12);
        color: #e6eaf0;
    }

    html[data-theme="auto"] .orbit-table-mobile tbody tr {
        background: #1b2330;
        border-color: rgba(255, 255, 255, 0.12);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    }

    html[data-theme="auto"] .orbit-table-mobile tbody tr:nth-child(even) {
        background: #1f2836;
    }

    html[data-theme="auto"] .orbit-table-mobile tbody td[data-label]::before {
        color: rgba(230, 234, 240, 0.7);
    }

}

/* Modal header / footer */
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
    background-color: #131b24;
    border-color: rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .modal-header,
    html[data-theme="auto"] .modal-footer {
        background-color: #131b24;
        border-color: rgba(255, 255, 255, 0.08);
    }
}

/* Modal close button visibility */
html[data-theme="dark"] .modal-header .btn-close {
    filter: invert(1) brightness(1.2);
    opacity: 0.8;
}

html[data-theme="dark"] .modal-header .btn-close:hover {
    opacity: 1;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .modal-header .btn-close {
        filter: invert(1) brightness(1.2);
        opacity: 0.8;
    }

    html[data-theme="auto"] .modal-header .btn-close:hover {
        opacity: 1;
    }
}

/* ========== Dropdowns ========== */
html[data-theme="dark"] .dropdown-menu {
    background-color: #151e28;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e6eaf0;
}

html[data-theme="dark"] .dropdown-menu .dropdown-item {
    color: #e6eaf0;
}

html[data-theme="dark"] .dropdown-menu .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

html[data-theme="dark"] .dropdown-divider {
    border-color: rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .dropdown-menu {
        background-color: #151e28;
        border-color: rgba(255, 255, 255, 0.12);
        color: #e6eaf0;
    }

    html[data-theme="auto"] .dropdown-menu .dropdown-item {
        color: #e6eaf0;
    }

    html[data-theme="auto"] .dropdown-menu .dropdown-item:hover {
        background-color: rgba(255, 255, 255, 0.06);
        color: #ffffff;
    }

    html[data-theme="auto"] .dropdown-divider {
        border-color: rgba(255, 255, 255, 0.08);
    }
}

/* ================================
   Helios – Dark mode (C3)
   Sidebar & navigation
   ================================ */

/* Subtle Helios blue accents – dark mode */

html[data-theme="dark"] #sidebar .nav-link.active,
html[data-theme="dark"] .nav.nav-pills .nav-link.active {
    background-color: var(--helios-blue-deep-soft);
}

html[data-theme="dark"] .card.is-primary,
html[data-theme="dark"] .card.border-primary {
    border-color: var(--helios-blue-deep-border) !important;
}

html[data-theme="dark"] .badge.bg-primary {
    background-color: var(--helios-blue-deep) !important;
    color: #e6eaf0 !important;
}

html[data-theme="dark"] .progress-bar.bg-info {
    background-color: var(--helios-blue-deep) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar .nav-link.active,
    html[data-theme="auto"] .nav.nav-pills .nav-link.active {
        background-color: var(--helios-blue-deep-soft);
    }

    html[data-theme="auto"] .card.is-primary,
    html[data-theme="auto"] .card.border-primary {
        border-color: var(--helios-blue-deep-border) !important;
    }

    html[data-theme="auto"] .badge.bg-primary {
        background-color: var(--helios-blue-deep) !important;
        color: #e6eaf0 !important;
    }
}

/* Sidebar container */
html[data-theme="dark"] #sidebar {
    background-color: #0b1220 !important;
    border-right-color: var(--helios-border-subtle);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar {
        background-color: #0b1220 !important;
        border-right-color: var(--helios-border-subtle);
    }
}

/* Sidebar section titles */
html[data-theme="dark"] #sidebar .nav-section-title {
    color: rgba(230, 234, 240, 0.55);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .nav-section-title {
        color: rgba(230, 234, 240, 0.55);
    }
}

/* Sidebar links */
html[data-theme="dark"] #sidebar .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] #sidebar .nav-link.active {
    background-color: rgba(255, 255, 255, 0.10);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .nav-link:hover {
        background-color: rgba(255, 255, 255, 0.05);
    }

    html[data-theme="auto"] #sidebar .nav-link.active {
        background-color: rgba(255, 255, 255, 0.10);
    }
}

html[data-theme="dark"] .btn-primary {
    background-color: var(--helios-blue-strong);
    border-color: var(--helios-blue);
    color: #0f1720;
}

html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-primary.text-white {
    color: #0f1720 !important;
}

html[data-theme="dark"] .btn-primary:hover {
    background-color: #8fb6d3;
    border-color: var(--helios-blue-strong);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .btn-primary.text-white {
        color: #0f1720 !important;
    }
}

html[data-theme="dark"] .btn-link {
    color: var(--helios-blue);
}

html[data-theme="dark"] .btn-link:hover {
    color: var(--helios-blue-strong);
}

html[data-theme="dark"] .bg-primary {
    background-color: var(--helios-blue) !important;
    color: #0f1720;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .btn-primary {
        background-color: var(--helios-blue-strong);
        border-color: var(--helios-blue);
        color: #0f1720;
    }

    html[data-theme="auto"] .btn-primary,
    html[data-theme="auto"] .btn-primary.text-white {
        color: #0f1720 !important;
    }

    html[data-theme="auto"] .btn-primary:hover {
        background-color: #8fb6d3;
        border-color: var(--helios-blue-strong);
    }

    html[data-theme="auto"] .btn-link {
        color: var(--helios-blue);
    }

    html[data-theme="auto"] .btn-link:hover {
        color: var(--helios-blue-strong);
    }

    html[data-theme="auto"] .bg-primary {
        background-color: var(--helios-blue) !important;
        color: #0f1720;
    }
}

/* Ensure text inside transparent buttons is readable in dark mode */
html[data-theme="dark"] .btn.bg-transparent,
html[data-theme="dark"] .btn.bg-transparent span,
html[data-theme="dark"] .btn.bg-transparent .fw-semibold {
    color: rgba(230, 234, 240, 0.85) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .btn.bg-transparent,
    html[data-theme="auto"] .btn.bg-transparent span,
    html[data-theme="auto"] .btn.bg-transparent .fw-semibold {
        color: rgba(230, 234, 240, 0.85) !important;
    }
}

/* Sidebar dividers */
html[data-theme="dark"] #sidebar hr,
html[data-theme="dark"] #sidebar .dropdown-divider {
    border-color: rgba(255, 255, 255, 0.12);
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar hr,
    html[data-theme="auto"] #sidebar .dropdown-divider {
        border-color: rgba(255, 255, 255, 0.12);
    }
}

/* ================================
   Helios – Dark mode (C4)
   Bootstrap utilities normalization
   ================================ */

/* List groups – dark mode */
html[data-theme="dark"] .list-group-item {
    background-color: #151e28;
    color: rgba(230, 234, 240, 0.85);
    border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .list-group-item-action:hover,
html[data-theme="dark"] .list-group-item-action:focus {
    background-color: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .list-group-item {
        background-color: #151e28;
        color: rgba(230, 234, 240, 0.85);
        border-color: rgba(255, 255, 255, 0.08);
    }

    html[data-theme="auto"] .list-group-item-action:hover,
    html[data-theme="auto"] .list-group-item-action:focus {
        background-color: rgba(255, 255, 255, 0.06);
        color: #ffffff;
    }
}

/* ---------- Text utilities ---------- */

html[data-theme="dark"] .text-secondary {
    color: rgba(230, 234, 240, 0.6) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-secondary {
        color: rgba(230, 234, 240, 0.6) !important;
    }
}

html[data-theme="dark"] .text-dark {
    color: rgba(230, 234, 240, 0.85) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-dark {
        color: rgba(230, 234, 240, 0.85) !important;
    }
}

html[data-theme="dark"] .text-dark.text-muted {
    color: rgba(230, 234, 240, 0.6) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-dark.text-muted {
        color: rgba(230, 234, 240, 0.6) !important;
    }
}

/* ---------- Background utilities ---------- */

/* Slightly darker secondary background */
html[data-theme="dark"] .bg-secondary {
    background-color: #1f2937 !important;
    color: #e5e7eb;
}

html[data-theme="dark"] .bg-dark {
    background-color: #020617 !important;
    color: #f8fafc !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .bg-secondary {
        background-color: #1f2937 !important;
        color: #e5e7eb;
    }

    html[data-theme="auto"] .bg-dark {
        background-color: #020617 !important;
        color: #f8fafc !important;
    }
}

/* Border utilities – darken slightly for dark mode */
html[data-theme="dark"] .border,
html[data-theme="dark"] .border-top,
html[data-theme="dark"] .border-bottom,
html[data-theme="dark"] .border-start,
html[data-theme="dark"] .border-end {
    border-color: rgba(255, 255, 255, 0.06) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .border,
    html[data-theme="auto"] .border-top,
    html[data-theme="auto"] .border-bottom,
    html[data-theme="auto"] .border-start,
    html[data-theme="auto"] .border-end {
        border-color: rgba(255, 255, 255, 0.06) !important;
    }
}

/* Device list divider – dark mode */
html[data-theme="dark"] .device-list-item {
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .device-list-item {
        border-bottom-color: rgba(255, 255, 255, 0.08) !important;
    }
}

/* ---------- Alerts (generic) ---------- */
html[data-theme="dark"] .alert {
    background-color: #151e28;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e6eaf0;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .alert {
        background-color: #151e28;
        border-color: rgba(255, 255, 255, 0.12);
        color: #e6eaf0;
    }
}

/* ================================
   Helios – Dark mode
   Toasts text & close icon
   ================================ */

/* Toast container */
html[data-theme="dark"] .toast {
    color: #0f1720;
    /* dark text for contrast on colored toasts */
}

/* Toast body text */
html[data-theme="dark"] .toast-body {
    color: #0f1720;
}

/* Toast close (X) button */
html[data-theme="dark"] .toast .btn-close {
    filter: none;
    opacity: 0.8;
}

html[data-theme="dark"] .toast .btn-close::before,
html[data-theme="dark"] .toast .btn-close::after {
    color: #0f1720;
}

/* Ensure consistency in auto dark mode */
@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .toast,
    html[data-theme="auto"] .toast-body {
        color: #0f1720;
    }

    html[data-theme="auto"] .toast .btn-close {
        filter: none;
        opacity: 0.8;
    }
}

/* ================================
   Helios – Dark mode (C5)
   Forms, DataTables, breadcrumbs
   ================================ */

/* Base form controls */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] textarea {
    background-color: #0f1720;
    color: #e6eaf0;
    border-color: rgba(255, 255, 255, 0.18);
}

/* Plaintext form controls (override light defaults) */
html[data-theme="dark"] .form-control-plaintext {
    background-color: #131b24;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;
    color: rgba(230, 234, 240, 0.85);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .form-control-plaintext {
        background-color: #131b24;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 10px;
        color: rgba(230, 234, 240, 0.85);
    }
}

html[data-theme="dark"] .form-control::placeholder {
    color: rgba(230, 234, 240, 0.45);
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
    background-color: #0f1720;
    color: #ffffff;
    border-color: #8ab2d2;
    box-shadow: none;
}

/* Disabled / readonly */
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] .form-select:disabled {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.5);
}

/* Improve disabled field visibility & UX */
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] .form-select:disabled,
html[data-theme="dark"] textarea:disabled {
    opacity: 1;
    cursor: not-allowed;
    border-color: rgba(255, 255, 255, 0.12);
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .form-control:disabled,
    html[data-theme="auto"] .form-control[readonly],
    html[data-theme="auto"] .form-select:disabled,
    html[data-theme="auto"] textarea:disabled {
        opacity: 1;
        cursor: not-allowed;
        border-color: rgba(255, 255, 255, 0.12);
    }
}

/* Auto */
@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .form-control,
    html[data-theme="auto"] .form-select,
    html[data-theme="auto"] textarea {
        background-color: #0f1720;
        color: #e6eaf0;
        border-color: rgba(255, 255, 255, 0.18);
    }

    html[data-theme="auto"] .form-control::placeholder {
        color: rgba(230, 234, 240, 0.45);
    }

    html[data-theme="auto"] .form-control:focus,
    html[data-theme="auto"] .form-select:focus {
        background-color: #0f1720;
        color: #ffffff;
        border-color: #8ab2d2;
        box-shadow: none;
    }
}

/* Input group addons */
html[data-theme="dark"] .input-group-text {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.75);
    border-color: rgba(255, 255, 255, 0.18);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .input-group-text {
        background-color: #131b24;
        color: rgba(230, 234, 240, 0.75);
        border-color: rgba(255, 255, 255, 0.18);
    }
}

/* Breadcrumbs */
html[data-theme="dark"] .breadcrumb {
    background-color: transparent;
}

html[data-theme="dark"] .breadcrumb-item,
html[data-theme="dark"] .breadcrumb-item a {
    color: rgba(230, 234, 240, 0.7);
}

html[data-theme="dark"] .breadcrumb-item.active {
    color: #ffffff;
}

/* Divider */
html[data-theme="dark"] .breadcrumb-item+.breadcrumb-item::before {
    color: rgba(230, 234, 240, 0.35);
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .breadcrumb-item,
    html[data-theme="auto"] .breadcrumb-item a {
        color: rgba(230, 234, 240, 0.7);
    }

    html[data-theme="auto"] .breadcrumb-item.active {
        color: #ffffff;
    }

    html[data-theme="auto"] .breadcrumb-item+.breadcrumb-item::before {
        color: rgba(230, 234, 240, 0.35);
    }
}

/* Text utilities */
/* text-white – soften for dark mode */
html[data-theme="dark"] .text-white {
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] .text-light {
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] .text-muted {
    color: rgba(230, 234, 240, 0.7) !important;
}

html[data-theme="dark"] .text-success {
    color: #5cb85c !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-white {
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] .text-light {
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] .text-muted {
        color: rgba(230, 234, 240, 0.7) !important;
    }

    html[data-theme="auto"] .text-success {
        color: #5cb85c !important;
    }
}

/* Form helper text */
html[data-theme="dark"] .form-text {
    color: rgba(230, 234, 240, 0.7) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .form-text {
        color: rgba(230, 234, 240, 0.7) !important;
    }
}

/* Background utilities */
html[data-theme="dark"] .bg-white {
    background-color: #0f1720 !important;
}

html[data-theme="dark"] .bg-light {
    background-color: #131b24 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .bg-white {
        background-color: #0f1720 !important;
    }

    html[data-theme="auto"] .bg-light {
        background-color: #131b24 !important;
    }
}

/* Tables base */
html[data-theme="dark"] table {
    color: rgba(230, 234, 240, 0.85);
}

/* Table head */
html[data-theme="dark"] .table-dark th {
    background-color: #1a2533 !important;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.12);
}

/* Table body */
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th {
    border-color: rgba(255, 255, 255, 0.12);
}

/* Striped rows */

/* Bordered */
html[data-theme="dark"] .table-bordered {
    border-color: rgba(255, 255, 255, 0.12);
}

/* Shadow */
html[data-theme="dark"] .shadow-sm {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.6) !important;
}


/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .table {
        --bs-table-border-color: rgba(255, 255, 255, 0.10);
        --bs-table-striped-border-color: rgba(255, 255, 255, 0.08);
        --bs-table-active-border-color: rgba(255, 255, 255, 0.14);
    }

    html[data-theme="auto"] .table> :not(caption)>*>* {
        border-bottom-color: rgba(255, 255, 255, 0.10) !important;
    }

    html[data-theme="auto"] .table thead th {
        border-bottom-color: rgba(255, 255, 255, 0.16) !important;
    }
}

html[data-theme="dark"] img.invert {
    filter: invert(1);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] img.invert {
        filter: invert(1) brightness(1.1);
    }
}

/* Icon inversion helper */
html[data-theme="dark"] .invert-dark {
    filter: invert(1) brightness(1.1);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .invert-dark {
        filter: invert(1) brightness(1.1);
    }
}

/* =====================================
   Helios segmented: never auto invert
   ===================================== */

html[data-theme="dark"] .helios-segmented img {
    filter: none !important;
}

/* Explicit opt-in still allowed */
html[data-theme="dark"] .helios-segmented img.invert-dark {
    filter: invert(1) brightness(1.1) !important;
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .helios-segmented img {
        filter: none !important;
    }

    html[data-theme="auto"] .helios-segmented img.invert-dark {
        filter: invert(1) brightness(1.1) !important;
    }
}

[data-theme="dark"] .backend-mode-indicator {
    background-color: rgba(255, 255, 255, 0.02);
    background-image: linear-gradient(45deg,
            rgba(255, 255, 255, 0.035) 25%,
            transparent 25%,
            transparent 50%,
            rgba(255, 255, 255, 0.035) 50%,
            rgba(255, 255, 255, 0.035) 75%,
            transparent 75%,
            transparent);
}

/* Common icon locations – default invert */
html[data-theme="dark"] .btn img,
html[data-theme="dark"] .dropdown-item img,
html[data-theme="dark"] table img {
    filter: invert(1) brightness(1.05);
}

/* Do NOT invert icons in user manage dropdown (icons are already light) */
html[data-theme="dark"] #userManage img {
    filter: none !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #userManage img {
        filter: none !important;
    }
}

/* Do NOT invert icons inside btn-white (already correct contrast) */
html[data-theme="dark"] .btn-white img {
    filter: none !important;
}

/* Allow explicit opt-in inversion inside btn-white */
html[data-theme="dark"] .btn-white .invert-dark {
    filter: invert(1) brightness(1.1) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .btn img,
    html[data-theme="auto"] .dropdown-item img,
    html[data-theme="auto"] table img {
        filter: invert(1) brightness(1.05);
    }

    /* Do NOT invert icons inside btn-white (already correct contrast) */
    html[data-theme="auto"] .btn-white img {
        filter: none !important;
    }

    /* Allow explicit opt-in inversion inside btn-white */
    html[data-theme="auto"] .btn-white .invert-dark {
        filter: invert(1) brightness(1.1) !important;
    }
}


/* ================================
   Helios – Dark mode (C6.1)
   btn-light normalization
   ================================ */

/* btn-light */
html[data-theme="dark"] .btn-light {
    background-color: #151e28;
    color: #e6eaf0;
    border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .btn-light:hover,
html[data-theme="dark"] .btn-light:focus {
    background-color: #1a2533;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: none;
}

/* Disabled */
html[data-theme="dark"] .btn-light:disabled,
html[data-theme="dark"] .btn-light.disabled {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.5);
    border-color: rgba(255, 255, 255, 0.12);
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .btn-light {
        background-color: #151e28;
        color: #e6eaf0;
        border-color: rgba(255, 255, 255, 0.18);
    }

    html[data-theme="auto"] .btn-light:hover,
    html[data-theme="auto"] .btn-light:focus {
        background-color: #1a2533;
        color: #ffffff;
        border-color: rgba(255, 255, 255, 0.28);
        box-shadow: none;
    }

    html[data-theme="auto"] .btn-light:disabled,
    html[data-theme="auto"] .btn-light.disabled {
        background-color: #131b24;
        color: rgba(230, 234, 240, 0.5);
        border-color: rgba(255, 255, 255, 0.12);
    }
}

/* ================================
   Helios – Dark mode
   btn-white text normalization
   ================================ */

html[data-theme="dark"] .btn-white {
    background-color: #151e28;
    color: rgba(230, 234, 240, 0.85);
    border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .btn-white:hover,
html[data-theme="dark"] .btn-white:focus {
    background-color: #1a2533;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: none;
}

html[data-theme="dark"] .btn-white:disabled,
html[data-theme="dark"] .btn-white.disabled {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.5);
    border-color: rgba(255, 255, 255, 0.12);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .btn-white {
        background-color: #151e28;
        color: rgba(230, 234, 240, 0.85);
        border-color: rgba(255, 255, 255, 0.18);
    }

    html[data-theme="auto"] .btn-white:hover,
    html[data-theme="auto"] .btn-white:focus {
        background-color: #1a2533;
        color: #ffffff;
        border-color: rgba(255, 255, 255, 0.28);
        box-shadow: none;
    }

    html[data-theme="auto"] .btn-white:disabled,
    html[data-theme="auto"] .btn-white.disabled {
        background-color: #131b24;
        color: rgba(230, 234, 240, 0.5);
        border-color: rgba(255, 255, 255, 0.12);
    }
}

/* ================================
   Helios – Dark mode (C6.2)
   Progress bars
   ================================ */

/* Progress background (track) */
html[data-theme="dark"] .progress {
    background-color: #000000;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .progress {
        background-color: #000000;
    }
}

/* Default progress bar */
html[data-theme="dark"] .progress-bar {
    background-color: #8ab2d2;
    color: #0f1720;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .progress-bar {
        background-color: #8ab2d2;
        color: #0f1720;
    }
}

/* Contextual progress variants */
html[data-theme="dark"] .progress-bar.bg-success {
    background-color: #7fcf7a !important;
}

html[data-theme="dark"] .progress-bar.bg-warning {
    background-color: #f0c36d !important;
    color: #0f1720;
}

html[data-theme="dark"] .progress-bar.bg-danger {
    background-color: #e07a7a !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .progress-bar.bg-success {
        background-color: #7fcf7a !important;
    }

    html[data-theme="auto"] .progress-bar.bg-info {
        background-color: #8ab2d2 !important;
    }

    html[data-theme="auto"] .progress-bar.bg-warning {
        background-color: #f0c36d !important;
        color: #0f1720;
    }

    html[data-theme="auto"] .progress-bar.bg-danger {
        background-color: #e07a7a !important;
    }
}

/* Pagination – dark mode */
html[data-theme="dark"] .pagination .page-link {
    background-color: #151e28;
    color: rgba(230, 234, 240, 0.85);
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .pagination .page-link:hover {
    background-color: #1a2533;
    color: #ffffff;
}

html[data-theme="dark"] .pagination .page-item.active .page-link {
    background-color: var(--helios-blue-deep);
    border-color: var(--helios-blue-deep);
    color: #ffffff;
}

html[data-theme="dark"] .pagination .page-item.disabled .page-link {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.4);
    border-color: rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {

    /* Pagination – auto dark mode */
    html[data-theme="auto"] .pagination .page-link {
        background-color: #151e28;
        color: rgba(230, 234, 240, 0.85);
        border-color: rgba(255, 255, 255, 0.12);
    }

    html[data-theme="auto"] .pagination .page-link:hover {
        background-color: #1a2533;
        color: #ffffff;
    }

    html[data-theme="auto"] .pagination .page-item.active .page-link {
        background-color: var(--helios-blue-deep);
        border-color: var(--helios-blue-deep);
        color: #ffffff;
    }

    html[data-theme="auto"] .pagination .page-item.disabled .page-link {
        background-color: #131b24;
        color: rgba(230, 234, 240, 0.4);
        border-color: rgba(255, 255, 255, 0.08);
    }
}

/* ================================
   Helios – Dark mode (C7)
   Neutralize legacy Helios blues
   ================================ */

/* Nav pills (desktop + mobile) */
html[data-theme="dark"] .nav.nav-pills .nav-link {
    color: rgba(230, 234, 240, 0.75);
    background-color: transparent;
}

html[data-theme="dark"] .nav.nav-pills .nav-link.active {
    background-color: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

html[data-theme="dark"] .nav.nav-pills .nav-link .badge {
    background-color: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .nav.nav-pills .nav-link {
        color: rgba(230, 234, 240, 0.75);
        background-color: transparent;
    }

    html[data-theme="auto"] .nav.nav-pills .nav-link.active {
        background-color: rgba(255, 255, 255, 0.12);
        color: #ffffff;
    }

    html[data-theme="auto"] .nav.nav-pills .nav-link .badge {
        background-color: rgba(255, 255, 255, 0.18) !important;
        color: #ffffff !important;
    }
}

/* Helios segmented controls */
html[data-theme="dark"] .helios-segmented .btn {
    color: rgba(230, 234, 240, 0.75);
    background-color: transparent;
    border-color: var(--helios-border-subtle);
}

/* Segmented: primary action button (e.g. Manage) */
html[data-theme="dark"] .helios-segmented .btn.btn-primary {
    background-color: #1a2533;
    border-color: var(--helios-blue);
    color: #ffffff !important;
}

html[data-theme="dark"] .helios-segmented .btn.btn-primary:hover {
    background-color: #223043;
    border-color: var(--helios-blue-strong);
}

html[data-theme="dark"] .helios-segmented .btn.is-selected,
html[data-theme="dark"] .helios-segmented label.btn.is-selected {
    background-color: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    color: #ffffff !important;
}

html[data-theme="dark"] .helios-segmented {
    border-top: 1px solid var(--helios-border-subtle);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .helios-segmented {
        border-top: 1px solid var(--helios-border-subtle);
    }
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .helios-segmented .btn {
        color: rgba(230, 234, 240, 0.75);
        background-color: transparent;
        border-color: var(--helios-border-subtle);
    }
}

/* Sidebar mobile tabs & dropdown tabs */
html[data-theme="dark"] #sidebar .nav-link,
html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item {
    background-color: transparent;
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] #sidebar .nav-link.active,
html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item.active {
    background-color: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar .nav-link,
    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item {
        background-color: transparent;
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] #sidebar .nav-link.active,
    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item.active {
        background-color: rgba(255, 255, 255, 0.12) !important;
        color: #ffffff !important;
    }
}

/* Kill remaining legacy bg-primary bleed */
html[data-theme="dark"] .bg-primary {
    background-color: var(--helios-blue) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .bg-primary {
        background-color: var(--helios-blue) !important;
    }
}

/* ================================
   Helios – Dark mode (C8)
   Sidebar deep neutral
   ================================ */

/* Sidebar base – remove blue cast */
html[data-theme="dark"] #sidebar {
    background-color: #0b1220 !important;
    background-image: none !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar {
        background-color: #0b1220 !important;
        background-image: none !important;
    }
}

/* Sidebar links */
html[data-theme="dark"] #sidebar .nav-link {
    color: rgba(230, 234, 240, 0.85);
}

html[data-theme="dark"] #sidebar .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

html[data-theme="dark"] #sidebar .nav-link.active {
    background-color: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .nav-link {
        color: rgba(230, 234, 240, 0.85);
    }

    html[data-theme="auto"] #sidebar .nav-link:hover {
        background-color: rgba(255, 255, 255, 0.06);
        color: #ffffff;
    }

    html[data-theme="auto"] #sidebar .nav-link.active {
        background-color: rgba(255, 255, 255, 0.12);
        color: #ffffff;
    }
}

/* Sidebar dropdown menus – neutralize blue */
html[data-theme="dark"] #sidebar .dropdown-menu,
html[data-theme="dark"] .dropdown-menu-primary {
    background-color: #151e28 !important;
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item {
    color: rgba(230, 234, 240, 0.9) !important;
}

html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar .dropdown-menu,
    html[data-theme="auto"] .dropdown-menu-primary {
        background-color: #151e28 !important;
        border-color: rgba(255, 255, 255, 0.12);
    }

    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item {
        color: rgba(230, 234, 240, 0.9) !important;
    }

    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item:hover {
        background-color: rgba(255, 255, 255, 0.08) !important;
        color: #ffffff !important;
    }
}

/* ---------- Tables: force text color in all rows ---------- */
html[data-theme="dark"] .table,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th {
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] .table-striped>tbody>tr:nth-of-type(odd),
html[data-theme="dark"] .table-striped>tbody>tr:nth-of-type(even) {
    color: rgba(230, 234, 240, 0.85) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .table,
    html[data-theme="auto"] .table td,
    html[data-theme="auto"] .table th {
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] .table-striped>tbody>tr:nth-of-type(odd),
    html[data-theme="auto"] .table-striped>tbody>tr:nth-of-type(even) {
        color: rgba(230, 234, 240, 0.85) !important;
    }
}

/* ---------- Tables: tooltip text on colored cells ---------- */
html[data-theme="dark"] td.bg-success .text-tooltip,
html[data-theme="dark"] td.bg-warning .text-tooltip,
html[data-theme="dark"] td.bg-info .text-tooltip,
html[data-theme="dark"] td.bg-danger .text-tooltip {
    color: #0f1720 !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] td.bg-success .text-tooltip,
    html[data-theme="auto"] td.bg-warning .text-tooltip,
    html[data-theme="auto"] td.bg-info .text-tooltip,
    html[data-theme="auto"] td.bg-danger .text-tooltip {
        color: #0f1720 !important;
    }
}

/* ================================
   Tables – border normalization (dark)
   ================================ */

/* ================================
   Tables – subtle dark borders
   ================================ */

html[data-theme="dark"] .table {
    --bs-table-border-color: #1f2937;
    --bs-table-striped-border-color: #1b2431;
    --bs-table-active-border-color: #334155;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .table {
        --bs-table-border-color: #1f2937;
        --bs-table-striped-border-color: #1b2431;
        --bs-table-active-border-color: #334155;
        --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
    }
}

/* Cell borders */
html[data-theme="dark"] .table> :not(caption)>*>* {
    border-bottom: 1px solid #1f2937 !important;
    border-right: 1px solid #1f2937 !important;
}

/* Header border a bit stronger */
html[data-theme="dark"] .table thead th {
    border-bottom: 1px solid #334155 !important;
    border-top: 0 !important;
}

/* Table outer border */
html[data-theme="dark"] .table-bordered {
    border: 1px solid #1f2937 !important;
}

/* Rounded outer table container */
html[data-theme="dark"] .table {
    border-radius: .5rem;
    overflow: hidden;
}

html[data-theme="dark"] .table {
    border: 1px solid #1f2937;
}

/* Ensure outer border when wrapped in .table-responsive */

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .table-responsive {
        border: 1px solid #1f2937;
        border-radius: .5rem;
        overflow: hidden;
    }
}

/* Prevent Bootstrap background bleed */
html[data-theme="dark"] .table> :not(caption)>*>* {
    background-color: transparent;
}

/* ================================
   Auto mode
   ================================ */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .table {
        --bs-table-border-color: #1f2937;
        --bs-table-striped-border-color: #1b2431;
        --bs-table-active-border-color: #334155;
    }

    html[data-theme="auto"] .table> :not(caption)>*>* {
        border-bottom: 1px solid #1f2937 !important;
        border-right: 1px solid #1f2937 !important;
        background-color: transparent;
    }

    html[data-theme="auto"] .table thead th {
        border-bottom: 1px solid #334155 !important;
        border-top: 0 !important;
    }

    html[data-theme="auto"] .table-bordered {
        border: 1px solid #1f2937 !important;
    }

    html[data-theme="auto"] .table {
        border-radius: .5rem;
        overflow: hidden;
    }

    html[data-theme="auto"] .table {
        border: 1px solid #1f2937;
    }
}

/* ================================
   Helios – Dark mode (C10)
   Legacy layout background overrides
   ================================ */

/* Sidebar container */
html[data-theme="dark"] #sidebar {
    background-color: #0b1220 !important;
    border-right-color: rgba(255, 255, 255, 0.08) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar {
        background-color: #0b1220 !important;
        border-right-color: rgba(255, 255, 255, 0.08) !important;
    }
}


/* ================================
   Helios – Dark mode
   Mobile navigation
   ================================ */

html[data-theme="dark"] .mobile-nav {
    background-color: #1a2533;
    /* align with manage button tone, slightly highlighted */
}

html[data-theme="dark"] .mobile-nav img,
html[data-theme="dark"] .mobile-nav svg {
    filter: invert(1) grayscale(1) brightness(1.2);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .mobile-nav {
        background-color: #1a2533;
    }

    html[data-theme="auto"] .mobile-nav img,
    html[data-theme="auto"] .mobile-nav svg {
        filter: invert(1) grayscale(1) brightness(1.2);
    }
}

/* Mobile header */
html[data-theme="dark"] #mobileHeader {
    background-color: #0f1720 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #mobileHeader {
        background-color: #0f1720 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
}

/* ================================
   Helios – Dark mode (C11)
   Override inline sidebar backgrounds
   ================================ */

/* Desktop sidebar header block */
html[data-theme="dark"] #sidebar>.border-bottom {
    background-color: #0b1220 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar>.border-bottom {
        background-color: #0b1220 !important;
    }
}

/* Sidebar scroll body (was inline #223f67) */
html[data-theme="dark"] #sidebar .offcanvas-body {
    background-color: #0b1220 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .offcanvas-body {
        background-color: #0b1220 !important;
    }
}

/* User dropdown menu (was inline #1d3557) */
html[data-theme="dark"] #sidebar .dropdown-menu {
    background-color: #151e28 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .dropdown-menu {
        background-color: #151e28 !important;
    }
}

/* Safety net: any remaining inline blue inside sidebar */
html[data-theme="dark"] #sidebar [style*="#223f67"],
html[data-theme="dark"] #sidebar [style*="#264773"],
html[data-theme="dark"] #sidebar [style*="#1d3557"] {
    background-color: #0b1220 !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar [style*="#223f67"],
    html[data-theme="auto"] #sidebar [style*="#264773"],
    html[data-theme="auto"] #sidebar [style*="#1d3557"] {
        background-color: #0b1220 !important;
    }
}

/* ================================
   Helios – Dark mode (C12)
   Kill remaining sidebar blues (logo, headers, dropdown items)
   ================================ */

/* Bootstrap helper classes leaking blue */
html[data-theme="dark"] .text-bg-dark {
    background-color: #0b1220 !important;
    color: rgba(230, 234, 240, 0.95) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-bg-dark {
        background-color: #0b1220 !important;
        color: rgba(230, 234, 240, 0.95) !important;
    }
}

/* Offcanvas header (mobile logo area) */
html[data-theme="dark"] #sidebar .offcanvas-header {
    background-color: #0b1220 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .offcanvas-header {
        background-color: #0b1220 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
}

/* Nav section toggle rows (Devices / Users / etc.) */
html[data-theme="dark"] #sidebar .nav-section-toggle {
    background-color: transparent !important;
    color: rgba(230, 234, 240, 0.7) !important;
}

html[data-theme="dark"] #sidebar .nav-section-toggle:hover {
    background-color: rgba(255, 255, 255, 0.06) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .nav-section-toggle {
        background-color: transparent !important;
        color: rgba(230, 234, 240, 0.7) !important;
    }

    html[data-theme="auto"] #sidebar .nav-section-toggle:hover {
        background-color: rgba(255, 255, 255, 0.06) !important;
        color: #ffffff !important;
    }
}

/* Dropdown items inside sidebar (Account / Security / etc.) */
html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item {
    background-color: transparent !important;
    color: rgba(230, 234, 240, 0.9) !important;
}

html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item {
        background-color: transparent !important;
        color: rgba(230, 234, 240, 0.9) !important;
    }

    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item:hover {
        background-color: rgba(255, 255, 255, 0.08) !important;
        color: #ffffff !important;
    }
}

/* Desktop logo header strip (inline background leftovers) */
html[data-theme="dark"] #sidebar>div[style*="background"] {
    background-color: #0b1220 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar>div[style*="background"] {
        background-color: #0b1220 !important;
    }
}

/* Dark badge text for success, danger, warning, and info badges */
html[data-theme="dark"] .badge.bg-success,
html[data-theme="dark"] .badge.bg-danger,
html[data-theme="dark"] .badge.bg-warning,
html[data-theme="dark"] .badge.bg-info {
    color: #0f172a !important;
    font-weight: 600;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .badge.bg-success,
    html[data-theme="auto"] .badge.bg-danger,
    html[data-theme="auto"] .badge.bg-warning,
    html[data-theme="auto"] .badge.bg-info {
        color: #0f172a !important;
        font-weight: 600;
    }
}

/* ================================
   Contextual content blocks (remarks, postmortem, notes)
   Dark mode normalization
   ================================ */

/* Warning blocks */
html[data-theme="dark"] .bg-warning.bg-opacity-10 {
    background-color: rgba(240, 195, 109, 0.12) !important;
}

html[data-theme="dark"] .text-warning-emphasis {
    color: #f0c36d !important;
}

/* Info blocks */
html[data-theme="dark"] .bg-info.bg-opacity-10 {
    background-color: rgba(138, 178, 210, 0.12) !important;
}

html[data-theme="dark"] .text-info-emphasis {
    color: #8ab2d2 !important;
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .bg-warning.bg-opacity-10 {
        background-color: rgba(240, 195, 109, 0.12) !important;
    }

    html[data-theme="auto"] .text-warning-emphasis {
        color: #f0c36d !important;
    }

    html[data-theme="auto"] .bg-info.bg-opacity-10 {
        background-color: rgba(138, 178, 210, 0.12) !important;
    }

    html[data-theme="auto"] .text-info-emphasis {
        color: #8ab2d2 !important;
    }
}

html[data-theme="dark"] .fs-5 {
    color: #ffffff;
    letter-spacing: 0.01em;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .fs-5 {
        color: #ffffff;
        letter-spacing: 0.01em;
    }
}

/* ================================
   Helios badge (dark)
   ================================ */

html[data-theme="dark"] .helios-badge {
    display: inline-block;
    padding: .15rem .5rem;
    font-size: .65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    border-radius: .4rem;
    background-color: #2a3446;
    color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .helios-badge {
        background-color: #2a3446;
        color: #ffffff;
    }
}

/* ================================
   Helios – Dark mode
   Timeline
   ================================ */

html[data-theme="dark"] .timeline::before {
    background-color: #334155;
    /* visible subtle line on dark bg */
}

html[data-theme="dark"] .timeline-dot {
    background-color: #94a3b8;
    /* soft light dot */
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .timeline::before {
        background-color: #334155;
    }

    html[data-theme="auto"] .timeline-dot {
        background-color: #94a3b8;
    }
}

/* Fix text-reset links inside content blocks (dark mode) */
html[data-theme="dark"] a.text-reset {
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] a.text-reset:hover {
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] a.text-reset {
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] a.text-reset:hover {
        color: #ffffff !important;
    }
}

/* ================================
   Helios – User menu appearance toggle (dark mode)
   ================================ */

html[data-theme="dark"] #userManageMenu .small.text-muted {
    color: #94a3b8 !important;
    /* muted slate */
}

/* Segmented container */
html[data-theme="dark"] #userManageMenu .helios-segmented {
    background-color: transparent;
}

/* Base buttons – fixed solid colors */
html[data-theme="dark"] #userManageMenu .helios-segmented .btn {
    background-color: #151e28;
    color: #cbd5e1;
    border-color: #2a3446;
}

/* Hover */
html[data-theme="dark"] #userManageMenu .helios-segmented .btn:hover {
    background-color: #1a2533;
    color: #ffffff;
}

/* Selected */
html[data-theme="dark"] #userManageMenu .helios-segmented .btn.is-selected {
    background-color: #2a3446;
    color: #ffffff;
    border-color: #3b4a63;
    font-weight: 600;
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #userManageMenu .small.text-muted {
        color: #94a3b8 !important;
    }

    html[data-theme="auto"] #userManageMenu .helios-segmented .btn {
        background-color: #151e28;
        color: #cbd5e1;
        border-color: #2a3446;
    }

    html[data-theme="auto"] #userManageMenu .helios-segmented .btn:hover {
        background-color: #1a2533;
        color: #ffffff;
    }

    html[data-theme="auto"] #userManageMenu .helios-segmented .btn.is-selected {
        background-color: #2a3446;
        color: #ffffff;
        border-color: #3b4a63;
        font-weight: 600;
    }
}

/* ================================
   Helios – Dark mode (C1)
   ================================ */

/* Force dark */
html[data-theme="dark"] {
    color-scheme: dark;
}

html[data-theme="dark"],
html[data-theme="auto"] {
    --helios-blue: #5f8fb3;
    --helios-blue-strong: #7aa7c7;
    --helios-blue-muted: rgba(95, 143, 179, 0.6);
    --helios-bg-main: #0f1720;
    --helios-bg-panel: #141d27;
    --helios-bg-panel-soft: #101824;
    --helios-border-subtle: #1f2937;
}

html[data-theme="dark"],
html[data-theme="auto"] {
    /* Subtle Helios blue accents (dark mode only) */
    --helios-blue-deep: #223f67;
    --helios-blue-deep-soft: #1e2f4d;
    --helios-blue-deep-border: #2a4166;
}

/* Ensure full-page dark background (prevent white bleed) */
html[data-theme="dark"] {
    background-color: #0f1720;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] {
        background-color: #0f1720;
    }
}

html[data-theme="dark"] body {
    background-color: #0f1720;
    color: #e6eaf0;
    min-height: 100vh;
}

html[data-theme="dark"] a {
    color: var(--helios-blue);
}

html[data-theme="dark"] a:hover {
    color: var(--helios-blue-strong);
}

/* Auto dark (OS preference) */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] {
        color-scheme: dark;
    }

    html[data-theme="auto"] body {
        background-color: #0f1720;
        color: #e6eaf0;
        min-height: 100vh;
    }

    html[data-theme="auto"] a {
        color: var(--helios-blue);
    }

    html[data-theme="auto"] a:hover {
        color: var(--helios-blue-strong);
    }
}

/* ================================
   Helios – Dark mode (C2)
   Cards / modals / dropdowns
   ================================ */

/* ========== Cards ========== */
html[data-theme="dark"] .card {
    background-color: #151e28;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e6eaf0;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .card {
        background-color: #151e28;
        border-color: rgba(255, 255, 255, 0.08);
        color: #e6eaf0;
    }
}

/* Card header & footer */
html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer {
    background-color: #131b24;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e6eaf0;
}

/* Card header with bg-primary – neutralize in dark mode */
html[data-theme="dark"] .card-header.bg-primary {
    background-color: #131b24 !important;
    color: #e6eaf0 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .card-header,
    html[data-theme="auto"] .card-footer {
        background-color: #131b24;
        border-color: rgba(255, 255, 255, 0.08);
        color: #e6eaf0;
    }

    html[data-theme="auto"] .card-header.bg-primary {
        background-color: #131b24 !important;
        color: #e6eaf0 !important;
        border-color: rgba(255, 255, 255, 0.08) !important;
    }
}

/* ========== Modals ========== */
html[data-theme="dark"] .modal-content {
    background-color: #151e28;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e6eaf0;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .modal-content {
        background-color: #151e28;
        border-color: rgba(255, 255, 255, 0.12);
        color: #e6eaf0;
    }
}

/* Modal header / footer */
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
    background-color: #131b24;
    border-color: rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .modal-header,
    html[data-theme="auto"] .modal-footer {
        background-color: #131b24;
        border-color: rgba(255, 255, 255, 0.08);
    }
}

/* Modal close button visibility */
html[data-theme="dark"] .modal-header .btn-close {
    filter: invert(1) brightness(1.2);
    opacity: 0.8;
}

html[data-theme="dark"] .modal-header .btn-close:hover {
    opacity: 1;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .modal-header .btn-close {
        filter: invert(1) brightness(1.2);
        opacity: 0.8;
    }

    html[data-theme="auto"] .modal-header .btn-close:hover {
        opacity: 1;
    }
}

/* ========== Dropdowns ========== */
html[data-theme="dark"] .dropdown-menu {
    background-color: #151e28;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e6eaf0;
}

html[data-theme="dark"] .dropdown-menu .dropdown-item {
    color: #e6eaf0;
}

html[data-theme="dark"] .dropdown-menu .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

html[data-theme="dark"] .dropdown-divider {
    border-color: rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .dropdown-menu {
        background-color: #151e28;
        border-color: rgba(255, 255, 255, 0.12);
        color: #e6eaf0;
    }

    html[data-theme="auto"] .dropdown-menu .dropdown-item {
        color: #e6eaf0;
    }

    html[data-theme="auto"] .dropdown-menu .dropdown-item:hover {
        background-color: rgba(255, 255, 255, 0.06);
        color: #ffffff;
    }

    html[data-theme="auto"] .dropdown-divider {
        border-color: rgba(255, 255, 255, 0.08);
    }
}

/* ================================
   Helios – Dark mode (C3)
   Sidebar & navigation
   ================================ */

/* Subtle Helios blue accents – dark mode */

html[data-theme="dark"] #sidebar .nav-link.active,
html[data-theme="dark"] .nav.nav-pills .nav-link.active {
    background-color: var(--helios-blue-deep-soft);
}

html[data-theme="dark"] .card.is-primary,
html[data-theme="dark"] .card.border-primary {
    border-color: var(--helios-blue-deep-border) !important;
}

html[data-theme="dark"] .badge.bg-primary {
    background-color: var(--helios-blue-deep) !important;
    color: #e6eaf0 !important;
}

html[data-theme="dark"] .progress-bar.bg-info {
    background-color: var(--helios-blue-deep) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar .nav-link.active,
    html[data-theme="auto"] .nav.nav-pills .nav-link.active {
        background-color: var(--helios-blue-deep-soft);
    }

    html[data-theme="auto"] .card.is-primary,
    html[data-theme="auto"] .card.border-primary {
        border-color: var(--helios-blue-deep-border) !important;
    }

    html[data-theme="auto"] .badge.bg-primary {
        background-color: var(--helios-blue-deep) !important;
        color: #e6eaf0 !important;
    }
}

/* Sidebar container */
html[data-theme="dark"] #sidebar {
    background-color: #0b1220 !important;
    border-right-color: var(--helios-border-subtle);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar {
        background-color: #0b1220 !important;
        border-right-color: var(--helios-border-subtle);
    }
}

/* Sidebar section titles */
html[data-theme="dark"] #sidebar .nav-section-title {
    color: rgba(230, 234, 240, 0.55);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .nav-section-title {
        color: rgba(230, 234, 240, 0.55);
    }
}

/* Sidebar links */
html[data-theme="dark"] #sidebar .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] #sidebar .nav-link.active {
    background-color: rgba(255, 255, 255, 0.10);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .nav-link:hover {
        background-color: rgba(255, 255, 255, 0.05);
    }

    html[data-theme="auto"] #sidebar .nav-link.active {
        background-color: rgba(255, 255, 255, 0.10);
    }
}

html[data-theme="dark"] .btn-link {
    color: var(--helios-blue);
}

html[data-theme="dark"] .btn-link:hover {
    color: var(--helios-blue-strong);
}

html[data-theme="dark"] .bg-primary {
    background-color: var(--helios-blue) !important;
    color: #0f1720;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .btn-link {
        color: var(--helios-blue);
    }

    html[data-theme="auto"] .btn-link:hover {
        color: var(--helios-blue-strong);
    }

    html[data-theme="auto"] .bg-primary {
        background-color: var(--helios-blue) !important;
        color: #0f1720;
    }
}

/* Ensure text inside transparent buttons is readable in dark mode */
html[data-theme="dark"] .btn.bg-transparent,
html[data-theme="dark"] .btn.bg-transparent span,
html[data-theme="dark"] .btn.bg-transparent .fw-semibold {
    color: rgba(230, 234, 240, 0.85) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .btn.bg-transparent,
    html[data-theme="auto"] .btn.bg-transparent span,
    html[data-theme="auto"] .btn.bg-transparent .fw-semibold {
        color: rgba(230, 234, 240, 0.85) !important;
    }
}

/* Sidebar dividers */
html[data-theme="dark"] #sidebar hr,
html[data-theme="dark"] #sidebar .dropdown-divider {
    border-color: rgba(255, 255, 255, 0.12);
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar hr,
    html[data-theme="auto"] #sidebar .dropdown-divider {
        border-color: rgba(255, 255, 255, 0.12);
    }
}

/* ================================
   Helios – Dark mode (C4)
   Bootstrap utilities normalization
   ================================ */

/* List groups – dark mode */
html[data-theme="dark"] .list-group-item {
    background-color: #151e28;
    color: rgba(230, 234, 240, 0.85);
    border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .list-group-item-action:hover,
html[data-theme="dark"] .list-group-item-action:focus {
    background-color: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .list-group-item {
        background-color: #151e28;
        color: rgba(230, 234, 240, 0.85);
        border-color: rgba(255, 255, 255, 0.08);
    }

    html[data-theme="auto"] .list-group-item-action:hover,
    html[data-theme="auto"] .list-group-item-action:focus {
        background-color: rgba(255, 255, 255, 0.06);
        color: #ffffff;
    }
}

/* ---------- Text utilities ---------- */

html[data-theme="dark"] .text-secondary {
    color: rgba(230, 234, 240, 0.6) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-secondary {
        color: rgba(230, 234, 240, 0.6) !important;
    }
}

html[data-theme="dark"] .text-dark {
    color: rgba(230, 234, 240, 0.85) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-dark {
        color: rgba(230, 234, 240, 0.85) !important;
    }
}

html[data-theme="dark"] .text-dark.text-muted {
    color: rgba(230, 234, 240, 0.6) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-dark.text-muted {
        color: rgba(230, 234, 240, 0.6) !important;
    }
}

/* ---------- Background utilities ---------- */

/* Slightly darker secondary background */
html[data-theme="dark"] .bg-secondary {
    background-color: #1f2937 !important;
    color: #e5e7eb;
}

html[data-theme="dark"] .bg-dark {
    background-color: #020617 !important;
    color: #f8fafc !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .bg-secondary {
        background-color: #1f2937 !important;
        color: #e5e7eb;
    }

    html[data-theme="auto"] .bg-dark {
        background-color: #020617 !important;
        color: #f8fafc !important;
    }
}

/* Border utilities – darken slightly for dark mode */
html[data-theme="dark"] .border,
html[data-theme="dark"] .border-top,
html[data-theme="dark"] .border-bottom,
html[data-theme="dark"] .border-start,
html[data-theme="dark"] .border-end {
    border-color: rgba(255, 255, 255, 0.06) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .border,
    html[data-theme="auto"] .border-top,
    html[data-theme="auto"] .border-bottom,
    html[data-theme="auto"] .border-start,
    html[data-theme="auto"] .border-end {
        border-color: rgba(255, 255, 255, 0.06) !important;
    }
}

/* Device list divider – dark mode */
html[data-theme="dark"] .device-list-item {
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .device-list-item {
        border-bottom-color: rgba(255, 255, 255, 0.08) !important;
    }
}

/* ---------- Alerts (generic) ---------- */
html[data-theme="dark"] .alert {
    background-color: #151e28;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e6eaf0;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .alert {
        background-color: #151e28;
        border-color: rgba(255, 255, 255, 0.12);
        color: #e6eaf0;
    }
}

/* ================================
   Helios – Dark mode (C5)
   Forms, DataTables, breadcrumbs
   ================================ */

/* Base form controls */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] textarea {
    background-color: #0f1720;
    color: #e6eaf0;
    border-color: rgba(255, 255, 255, 0.18);
}

/* Plaintext form controls (override light defaults) */
html[data-theme="dark"] .form-control-plaintext {
    background-color: #131b24;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;
    color: rgba(230, 234, 240, 0.85);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .form-control-plaintext {
        background-color: #131b24;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 10px;
        color: rgba(230, 234, 240, 0.85);
    }
}

html[data-theme="dark"] .form-control::placeholder {
    color: rgba(230, 234, 240, 0.45);
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
    background-color: #0f1720;
    color: #ffffff;
    border-color: #8ab2d2;
    box-shadow: none;
}

/* Disabled / readonly */
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] .form-select:disabled {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.5);
}

/* Improve disabled field visibility & UX */
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] .form-select:disabled,
html[data-theme="dark"] textarea:disabled {
    opacity: 1;
    cursor: not-allowed;
    border-color: rgba(255, 255, 255, 0.12);
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .form-control:disabled,
    html[data-theme="auto"] .form-control[readonly],
    html[data-theme="auto"] .form-select:disabled,
    html[data-theme="auto"] textarea:disabled {
        opacity: 1;
        cursor: not-allowed;
        border-color: rgba(255, 255, 255, 0.12);
    }
}

/* Auto */
@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .form-control,
    html[data-theme="auto"] .form-select,
    html[data-theme="auto"] textarea {
        background-color: #0f1720;
        color: #e6eaf0;
        border-color: rgba(255, 255, 255, 0.18);
    }

    html[data-theme="auto"] .form-control::placeholder {
        color: rgba(230, 234, 240, 0.45);
    }

    html[data-theme="auto"] .form-control:focus,
    html[data-theme="auto"] .form-select:focus {
        background-color: #0f1720;
        color: #ffffff;
        border-color: #8ab2d2;
        box-shadow: none;
    }
}

/* Input group addons */
html[data-theme="dark"] .input-group-text {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.75);
    border-color: rgba(255, 255, 255, 0.18);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .input-group-text {
        background-color: #131b24;
        color: rgba(230, 234, 240, 0.75);
        border-color: rgba(255, 255, 255, 0.18);
    }
}

/* Breadcrumbs */
html[data-theme="dark"] .breadcrumb {
    background-color: transparent;
}

html[data-theme="dark"] .breadcrumb-item,
html[data-theme="dark"] .breadcrumb-item a {
    color: rgba(230, 234, 240, 0.7);
}

html[data-theme="dark"] .breadcrumb-item.active {
    color: #ffffff;
}

/* Divider */
html[data-theme="dark"] .breadcrumb-item+.breadcrumb-item::before {
    color: rgba(230, 234, 240, 0.35);
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .breadcrumb-item,
    html[data-theme="auto"] .breadcrumb-item a {
        color: rgba(230, 234, 240, 0.7);
    }

    html[data-theme="auto"] .breadcrumb-item.active {
        color: #ffffff;
    }

    html[data-theme="auto"] .breadcrumb-item+.breadcrumb-item::before {
        color: rgba(230, 234, 240, 0.35);
    }
}

/* Text utilities */
/* text-white – soften for dark mode */
html[data-theme="dark"] .text-white {
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] .text-light {
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] .text-muted {
    color: rgba(230, 234, 240, 0.7) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-white {
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] .text-light {
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] .text-muted {
        color: rgba(230, 234, 240, 0.7) !important;
    }
}

/* Form helper text */
html[data-theme="dark"] .form-text {
    color: rgba(230, 234, 240, 0.7) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .form-text {
        color: rgba(230, 234, 240, 0.7) !important;
    }
}

/* Background utilities */
html[data-theme="dark"] .bg-white {
    background-color: #0f1720 !important;
}

html[data-theme="dark"] .bg-light {
    background-color: #131b24 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .bg-white {
        background-color: #0f1720 !important;
    }

    html[data-theme="auto"] .bg-light {
        background-color: #131b24 !important;
    }
}

/* Tables base */
html[data-theme="dark"] table {
    color: rgba(230, 234, 240, 0.85);
}

/* Table head */
html[data-theme="dark"] .table-dark th {
    background-color: #1a2533 !important;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.12);
}

/* Table body */
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th {
    border-color: rgba(255, 255, 255, 0.12);
}

/* Striped rows */

/* Bordered */
html[data-theme="dark"] .table-bordered {
    border-color: rgba(255, 255, 255, 0.12);
}

/* Shadow */
html[data-theme="dark"] .shadow-sm {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.6) !important;
}


/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .table {
        --bs-table-border-color: rgba(255, 255, 255, 0.10);
        --bs-table-striped-border-color: rgba(255, 255, 255, 0.08);
        --bs-table-active-border-color: rgba(255, 255, 255, 0.14);
    }

    html[data-theme="auto"] .table> :not(caption)>*>* {
        border-bottom-color: rgba(255, 255, 255, 0.10) !important;
    }

    html[data-theme="auto"] .table thead th {
        border-bottom-color: rgba(255, 255, 255, 0.16) !important;
    }
}

/* Icon inversion helper */
html[data-theme="dark"] .invert-dark {
    filter: invert(1) brightness(1.1);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .invert-dark {
        filter: invert(1) brightness(1.1);
    }
}

/* =====================================
   Helios segmented: never auto invert
   ===================================== */

html[data-theme="dark"] .helios-segmented img {
    filter: none !important;
}

/* Explicit opt-in still allowed */
html[data-theme="dark"] .helios-segmented img.invert-dark {
    filter: invert(1) brightness(1.1) !important;
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .helios-segmented img {
        filter: none !important;
    }

    html[data-theme="auto"] .helios-segmented img.invert-dark {
        filter: invert(1) brightness(1.1) !important;
    }
}

/* Common icon locations – default invert */
html[data-theme="dark"] .btn img,
html[data-theme="dark"] .dropdown-item img,
html[data-theme="dark"] table img {
    filter: invert(1) brightness(1.05);
}

/* Do NOT invert icons in user manage dropdown (icons are already light) */
html[data-theme="dark"] #userManage img {
    filter: none !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #userManage img {
        filter: none !important;
    }
}

/* Do NOT invert icons inside btn-white (already correct contrast) */
html[data-theme="dark"] .btn-white img {
    filter: none !important;
}

/* Allow explicit opt-in inversion inside btn-white */
html[data-theme="dark"] .btn-white .invert-dark {
    filter: invert(1) brightness(1.1) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .btn img,
    html[data-theme="auto"] .dropdown-item img,
    html[data-theme="auto"] table img {
        filter: invert(1) brightness(1.05);
    }

    /* Do NOT invert icons inside btn-white (already correct contrast) */
    html[data-theme="auto"] .btn-white img {
        filter: none !important;
    }

    /* Allow explicit opt-in inversion inside btn-white */
    html[data-theme="auto"] .btn-white .invert-dark {
        filter: invert(1) brightness(1.1) !important;
    }
}


/* ================================
   Helios – Dark mode (C6.1)
   btn-light normalization
   ================================ */

/* btn-light */
html[data-theme="dark"] .btn-light {
    background-color: #151e28;
    color: #e6eaf0;
    border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .btn-light:hover,
html[data-theme="dark"] .btn-light:focus {
    background-color: #1a2533;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: none;
}

/* Disabled */
html[data-theme="dark"] .btn-light:disabled,
html[data-theme="dark"] .btn-light.disabled {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.5);
    border-color: rgba(255, 255, 255, 0.12);
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .btn-light {
        background-color: #151e28;
        color: #e6eaf0;
        border-color: rgba(255, 255, 255, 0.18);
    }

    html[data-theme="auto"] .btn-light:hover,
    html[data-theme="auto"] .btn-light:focus {
        background-color: #1a2533;
        color: #ffffff;
        border-color: rgba(255, 255, 255, 0.28);
        box-shadow: none;
    }

    html[data-theme="auto"] .btn-light:disabled,
    html[data-theme="auto"] .btn-light.disabled {
        background-color: #131b24;
        color: rgba(230, 234, 240, 0.5);
        border-color: rgba(255, 255, 255, 0.12);
    }
}

/* ================================
   Helios – Dark mode
   btn-white text normalization
   ================================ */

html[data-theme="dark"] .btn-white {
    background-color: #151e28;
    color: rgba(230, 234, 240, 0.85);
    border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .btn-white:hover,
html[data-theme="dark"] .btn-white:focus {
    background-color: #1a2533;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: none;
}

html[data-theme="dark"] .btn-white:disabled,
html[data-theme="dark"] .btn-white.disabled {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.5);
    border-color: rgba(255, 255, 255, 0.12);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .btn-white {
        background-color: #151e28;
        color: rgba(230, 234, 240, 0.85);
        border-color: rgba(255, 255, 255, 0.18);
    }

    html[data-theme="auto"] .btn-white:hover,
    html[data-theme="auto"] .btn-white:focus {
        background-color: #1a2533;
        color: #ffffff;
        border-color: rgba(255, 255, 255, 0.28);
        box-shadow: none;
    }

    html[data-theme="auto"] .btn-white:disabled,
    html[data-theme="auto"] .btn-white.disabled {
        background-color: #131b24;
        color: rgba(230, 234, 240, 0.5);
        border-color: rgba(255, 255, 255, 0.12);
    }
}

/* ================================
   Helios – Dark mode (C6.2)
   Progress bars
   ================================ */

/* Progress background (track) */
html[data-theme="dark"] .progress {
    background-color: #000000;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .progress {
        background-color: #000000;
    }
}

/* Default progress bar */
html[data-theme="dark"] .progress-bar {
    background-color: #8ab2d2;
    color: #0f1720;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .progress-bar {
        background-color: #8ab2d2;
        color: #0f1720;
    }
}

/* Contextual progress variants */
html[data-theme="dark"] .progress-bar.bg-success {
    background-color: #7fcf7a !important;
}

html[data-theme="dark"] .progress-bar.bg-warning {
    background-color: #f0c36d !important;
    color: #0f1720;
}

html[data-theme="dark"] .progress-bar.bg-danger {
    background-color: #e07a7a !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .progress-bar.bg-success {
        background-color: #7fcf7a !important;
    }

    html[data-theme="auto"] .progress-bar.bg-info {
        background-color: #8ab2d2 !important;
    }

    html[data-theme="auto"] .progress-bar.bg-warning {
        background-color: #f0c36d !important;
        color: #0f1720;
    }

    html[data-theme="auto"] .progress-bar.bg-danger {
        background-color: #e07a7a !important;
    }
}

/* Pagination – dark mode */
html[data-theme="dark"] .pagination .page-link {
    background-color: #151e28;
    color: rgba(230, 234, 240, 0.85);
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .pagination .page-link:hover {
    background-color: #1a2533;
    color: #ffffff;
}

html[data-theme="dark"] .pagination .page-item.active .page-link {
    background-color: var(--helios-blue-deep);
    border-color: var(--helios-blue-deep);
    color: #ffffff;
}

html[data-theme="dark"] .pagination .page-item.disabled .page-link {
    background-color: #131b24;
    color: rgba(230, 234, 240, 0.4);
    border-color: rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {

    /* Pagination – auto dark mode */
    html[data-theme="auto"] .pagination .page-link {
        background-color: #151e28;
        color: rgba(230, 234, 240, 0.85);
        border-color: rgba(255, 255, 255, 0.12);
    }

    html[data-theme="auto"] .pagination .page-link:hover {
        background-color: #1a2533;
        color: #ffffff;
    }

    html[data-theme="auto"] .pagination .page-item.active .page-link {
        background-color: var(--helios-blue-deep);
        border-color: var(--helios-blue-deep);
        color: #ffffff;
    }

    html[data-theme="auto"] .pagination .page-item.disabled .page-link {
        background-color: #131b24;
        color: rgba(230, 234, 240, 0.4);
        border-color: rgba(255, 255, 255, 0.08);
    }
}

/* ================================
   Helios – Dark mode (C7)
   Neutralize legacy Helios blues
   ================================ */

/* Nav pills (desktop + mobile) */
html[data-theme="dark"] .nav.nav-pills .nav-link {
    color: rgba(230, 234, 240, 0.75);
    background-color: transparent;
}

html[data-theme="dark"] .nav.nav-pills .nav-link.active {
    background-color: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

html[data-theme="dark"] .nav.nav-pills .nav-link .badge {
    background-color: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .nav.nav-pills .nav-link {
        color: rgba(230, 234, 240, 0.75);
        background-color: transparent;
    }

    html[data-theme="auto"] .nav.nav-pills .nav-link.active {
        background-color: rgba(255, 255, 255, 0.12);
        color: #ffffff;
    }

    html[data-theme="auto"] .nav.nav-pills .nav-link .badge {
        background-color: rgba(255, 255, 255, 0.18) !important;
        color: #ffffff !important;
    }
}

/* Helios segmented controls */
html[data-theme="dark"] .helios-segmented .btn {
    color: rgba(230, 234, 240, 0.75);
    background-color: transparent;
    border-color: var(--helios-border-subtle);
}

/* Segmented: primary action button (e.g. Manage) */
html[data-theme="dark"] .helios-segmented .btn.btn-primary {
    background-color: #1a2533;
    border-color: var(--helios-blue);
    color: #ffffff !important;
}

html[data-theme="dark"] .helios-segmented .btn.btn-primary:hover {
    background-color: #223043;
    border-color: var(--helios-blue-strong);
}

html[data-theme="dark"] .helios-segmented .btn.is-selected,
html[data-theme="dark"] .helios-segmented label.btn.is-selected {
    background-color: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .helios-segmented .btn {
        color: rgba(230, 234, 240, 0.75);
        background-color: transparent;
        border-color: var(--helios-border-subtle);
    }

    /* Segmented: primary action button (auto dark) */
    html[data-theme="auto"] .helios-segmented .btn.btn-primary {
        background-color: #1a2533;
        border-color: var(--helios-blue);
        color: #ffffff !important;
    }

    html[data-theme="auto"] .helios-segmented .btn.btn-primary:hover {
        background-color: #223043;
        border-color: var(--helios-blue-strong);
    }

    html[data-theme="auto"] .helios-segmented .btn.is-selected,
    html[data-theme="auto"] .helios-segmented label.btn.is-selected {
        background-color: rgba(255, 255, 255, 0.14);
        border-color: rgba(255, 255, 255, 0.22);
        color: #ffffff;
    }
}

/* Sidebar mobile tabs & dropdown tabs */
html[data-theme="dark"] #sidebar .nav-link,
html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item {
    background-color: transparent;
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] #sidebar .nav-link.active,
html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item.active {
    background-color: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar .nav-link,
    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item {
        background-color: transparent;
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] #sidebar .nav-link.active,
    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item.active {
        background-color: rgba(255, 255, 255, 0.12) !important;
        color: #ffffff !important;
    }
}

/* Kill remaining legacy bg-primary bleed */
html[data-theme="dark"] .bg-primary {
    background-color: var(--helios-blue) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .bg-primary {
        background-color: var(--helios-blue) !important;
    }
}

/* ================================
   Helios – Dark mode (C8)
   Sidebar deep neutral
   ================================ */

/* Sidebar base – remove blue cast */
html[data-theme="dark"] #sidebar {
    background-color: #0b1220 !important;
    background-image: none !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar {
        background-color: #0b1220 !important;
        background-image: none !important;
    }
}

/* Sidebar links */
html[data-theme="dark"] #sidebar .nav-link {
    color: rgba(230, 234, 240, 0.85);
}

html[data-theme="dark"] #sidebar .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

html[data-theme="dark"] #sidebar .nav-link.active {
    background-color: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .nav-link {
        color: rgba(230, 234, 240, 0.85);
    }

    html[data-theme="auto"] #sidebar .nav-link:hover {
        background-color: rgba(255, 255, 255, 0.06);
        color: #ffffff;
    }

    html[data-theme="auto"] #sidebar .nav-link.active {
        background-color: rgba(255, 255, 255, 0.12);
        color: #ffffff;
    }
}

/* Sidebar dropdown menus – neutralize blue */
html[data-theme="dark"] #sidebar .dropdown-menu,
html[data-theme="dark"] .dropdown-menu-primary {
    background-color: #151e28 !important;
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item {
    color: rgba(230, 234, 240, 0.9) !important;
}

html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar .dropdown-menu,
    html[data-theme="auto"] .dropdown-menu-primary {
        background-color: #151e28 !important;
        border-color: rgba(255, 255, 255, 0.12);
    }

    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item {
        color: rgba(230, 234, 240, 0.9) !important;
    }

    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item:hover {
        background-color: rgba(255, 255, 255, 0.08) !important;
        color: #ffffff !important;
    }
}

/* ---------- Tables: force text color in all rows ---------- */
html[data-theme="dark"] .table,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th {
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] .table-striped>tbody>tr:nth-of-type(odd),
html[data-theme="dark"] .table-striped>tbody>tr:nth-of-type(even) {
    color: rgba(230, 234, 240, 0.85) !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] .table,
    html[data-theme="auto"] .table td,
    html[data-theme="auto"] .table th {
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] .table-striped>tbody>tr:nth-of-type(odd),
    html[data-theme="auto"] .table-striped>tbody>tr:nth-of-type(even) {
        color: rgba(230, 234, 240, 0.85) !important;
    }
}

/* ---------- Tables: tooltip text on colored cells ---------- */
html[data-theme="dark"] td.bg-success .text-tooltip,
html[data-theme="dark"] td.bg-warning .text-tooltip,
html[data-theme="dark"] td.bg-info .text-tooltip,
html[data-theme="dark"] td.bg-danger .text-tooltip {
    color: #0f1720 !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] td.bg-success .text-tooltip,
    html[data-theme="auto"] td.bg-warning .text-tooltip,
    html[data-theme="auto"] td.bg-info .text-tooltip,
    html[data-theme="auto"] td.bg-danger .text-tooltip {
        color: #0f1720 !important;
    }
}

/* ================================
   Tables – border normalization (dark)
   ================================ */

/* ================================
   Tables – subtle dark borders
   ================================ */

html[data-theme="dark"] .table {
    --bs-table-border-color: #1f2937;
    --bs-table-striped-border-color: #1b2431;
    --bs-table-active-border-color: #334155;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .table {
        --bs-table-border-color: #1f2937;
        --bs-table-striped-border-color: #1b2431;
        --bs-table-active-border-color: #334155;
        --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
    }
}

/* Cell borders */
html[data-theme="dark"] .table> :not(caption)>*>* {
    border-bottom: 1px solid #1f2937 !important;
    border-right: 1px solid #1f2937 !important;
}

/* Header border a bit stronger */
html[data-theme="dark"] .table thead th {
    border-bottom: 1px solid #334155 !important;
    border-top: 0 !important;
}

/* Table outer border */
html[data-theme="dark"] .table-bordered {
    border: 1px solid #1f2937 !important;
}

/* Rounded outer table container */
html[data-theme="dark"] .table {
    border-radius: .5rem;
    overflow: hidden;
}

html[data-theme="dark"] .table {
    border: 1px solid #1f2937;
}

/* Ensure outer border when wrapped in .table-responsive */

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .table-responsive {
        border: 1px solid #1f2937;
        border-radius: .5rem;
        overflow: hidden;
    }
}

/* Prevent Bootstrap background bleed */
html[data-theme="dark"] .table> :not(caption)>*>* {
    background-color: transparent;
}

/* ================================
   Auto mode
   ================================ */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .table {
        --bs-table-border-color: #1f2937;
        --bs-table-striped-border-color: #1b2431;
        --bs-table-active-border-color: #334155;
    }

    html[data-theme="auto"] .table> :not(caption)>*>* {
        border-bottom: 1px solid #1f2937 !important;
        border-right: 1px solid #1f2937 !important;
        background-color: transparent;
    }

    html[data-theme="auto"] .table thead th {
        border-bottom: 1px solid #334155 !important;
        border-top: 0 !important;
    }

    html[data-theme="auto"] .table-bordered {
        border: 1px solid #1f2937 !important;
    }

    html[data-theme="auto"] .table {
        border-radius: .5rem;
        overflow: hidden;
    }

    html[data-theme="auto"] .table {
        border: 1px solid #1f2937;
    }
}

/* ================================
   Helios – Dark mode (C10)
   Legacy layout background overrides
   ================================ */

/* Sidebar container */
html[data-theme="dark"] #sidebar {
    background-color: #0b1220 !important;
    border-right-color: rgba(255, 255, 255, 0.08) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar {
        background-color: #0b1220 !important;
        border-right-color: rgba(255, 255, 255, 0.08) !important;
    }
}


/* ================================
   Helios – Dark mode
   Mobile navigation
   ================================ */

html[data-theme="dark"] .mobile-nav {
    background-color: #1a2533;
    /* align with manage button tone, slightly highlighted */
}

html[data-theme="dark"] .mobile-nav img,
html[data-theme="dark"] .mobile-nav svg {
    filter: invert(1) grayscale(1) brightness(1.2);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .mobile-nav {
        background-color: #1a2533;
    }

    html[data-theme="auto"] .mobile-nav img,
    html[data-theme="auto"] .mobile-nav svg {
        filter: invert(1) grayscale(1) brightness(1.2);
    }
}

/* Mobile header */
html[data-theme="dark"] #mobileHeader {
    background-color: #0f1720 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #mobileHeader {
        background-color: #0f1720 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
}

/* ================================
   Helios – Dark mode (C11)
   Override inline sidebar backgrounds
   ================================ */

/* Desktop sidebar header block */
html[data-theme="dark"] #sidebar>.border-bottom {
    background-color: #0b1220 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar>.border-bottom {
        background-color: #0b1220 !important;
    }
}

/* Sidebar scroll body (was inline #223f67) */
html[data-theme="dark"] #sidebar .offcanvas-body {
    background-color: #0b1220 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .offcanvas-body {
        background-color: #0b1220 !important;
    }
}

/* User dropdown menu (was inline #1d3557) */
html[data-theme="dark"] #sidebar .dropdown-menu {
    background-color: #151e28 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .dropdown-menu {
        background-color: #151e28 !important;
    }
}

/* Safety net: any remaining inline blue inside sidebar */
html[data-theme="dark"] #sidebar [style*="#223f67"],
html[data-theme="dark"] #sidebar [style*="#264773"],
html[data-theme="dark"] #sidebar [style*="#1d3557"] {
    background-color: #0b1220 !important;
}

@media (prefers-color-scheme: dark) {

    html[data-theme="auto"] #sidebar [style*="#223f67"],
    html[data-theme="auto"] #sidebar [style*="#264773"],
    html[data-theme="auto"] #sidebar [style*="#1d3557"] {
        background-color: #0b1220 !important;
    }
}

/* ================================
   Helios – Dark mode (C12)
   Kill remaining sidebar blues (logo, headers, dropdown items)
   ================================ */

/* Bootstrap helper classes leaking blue */
html[data-theme="dark"] .text-bg-dark {
    background-color: #0b1220 !important;
    color: rgba(230, 234, 240, 0.95) !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .text-bg-dark {
        background-color: #0b1220 !important;
        color: rgba(230, 234, 240, 0.95) !important;
    }
}

/* Offcanvas header (mobile logo area) */
html[data-theme="dark"] #sidebar .offcanvas-header {
    background-color: #0b1220 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .offcanvas-header {
        background-color: #0b1220 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
}

/* Nav section toggle rows (Devices / Users / etc.) */
html[data-theme="dark"] #sidebar .nav-section-toggle {
    background-color: transparent !important;
    color: rgba(230, 234, 240, 0.7) !important;
}

html[data-theme="dark"] #sidebar .nav-section-toggle:hover {
    background-color: rgba(255, 255, 255, 0.06) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .nav-section-toggle {
        background-color: transparent !important;
        color: rgba(230, 234, 240, 0.7) !important;
    }

    html[data-theme="auto"] #sidebar .nav-section-toggle:hover {
        background-color: rgba(255, 255, 255, 0.06) !important;
        color: #ffffff !important;
    }
}

/* Dropdown items inside sidebar (Account / Security / etc.) */
html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item {
    background-color: transparent !important;
    color: rgba(230, 234, 240, 0.9) !important;
}

html[data-theme="dark"] #sidebar .dropdown-menu .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item {
        background-color: transparent !important;
        color: rgba(230, 234, 240, 0.9) !important;
    }

    html[data-theme="auto"] #sidebar .dropdown-menu .dropdown-item:hover {
        background-color: rgba(255, 255, 255, 0.08) !important;
        color: #ffffff !important;
    }
}

/* Desktop logo header strip (inline background leftovers) */
html[data-theme="dark"] #sidebar>div[style*="background"] {
    background-color: #0b1220 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #sidebar>div[style*="background"] {
        background-color: #0b1220 !important;
    }
}

/* ================================
   Contextual content blocks (remarks, postmortem, notes)
   Dark mode normalization
   ================================ */

/* Warning blocks */
html[data-theme="dark"] .bg-warning.bg-opacity-10 {
    background-color: rgba(240, 195, 109, 0.12) !important;
}

html[data-theme="dark"] .text-warning-emphasis {
    color: #f0c36d !important;
}

/* Info blocks */
html[data-theme="dark"] .bg-info.bg-opacity-10 {
    background-color: rgba(138, 178, 210, 0.12) !important;
}

html[data-theme="dark"] .text-info-emphasis {
    color: #8ab2d2 !important;
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .bg-warning.bg-opacity-10 {
        background-color: rgba(240, 195, 109, 0.12) !important;
    }

    html[data-theme="auto"] .text-warning-emphasis {
        color: #f0c36d !important;
    }

    html[data-theme="auto"] .bg-info.bg-opacity-10 {
        background-color: rgba(138, 178, 210, 0.12) !important;
    }

    html[data-theme="auto"] .text-info-emphasis {
        color: #8ab2d2 !important;
    }
}

html[data-theme="dark"] .fs-5 {
    color: #ffffff;
    letter-spacing: 0.01em;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .fs-5 {
        color: #ffffff;
        letter-spacing: 0.01em;
    }
}

/* ================================
   Helios badge (dark)
   ================================ */

html[data-theme="dark"] .helios-badge {
    display: inline-block;
    padding: .15rem .5rem;
    font-size: .65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    border-radius: .4rem;
    background-color: #2a3446;
    color: #ffffff;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .helios-badge {
        background-color: #2a3446;
        color: #ffffff;
    }
}

/* ================================
   Helios – Dark mode
   Timeline
   ================================ */

html[data-theme="dark"] .timeline::before {
    background-color: #334155;
    /* visible subtle line on dark bg */
}

html[data-theme="dark"] .timeline-dot {
    background-color: #94a3b8;
    /* soft light dot */
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .timeline::before {
        background-color: #334155;
    }

    html[data-theme="auto"] .timeline-dot {
        background-color: #94a3b8;
    }
}

/* Fix text-reset links inside content blocks (dark mode) */
html[data-theme="dark"] a.text-reset {
    color: rgba(230, 234, 240, 0.85) !important;
}

html[data-theme="dark"] a.text-reset:hover {
    color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] a.text-reset {
        color: rgba(230, 234, 240, 0.85) !important;
    }

    html[data-theme="auto"] a.text-reset:hover {
        color: #ffffff !important;
    }
}

/* ================================
   Helios – User menu appearance toggle (dark mode)
   ================================ */

html[data-theme="dark"] #userManageMenu .small.text-muted {
    color: #94a3b8 !important;
    /* muted slate */
}

/* Segmented container */
html[data-theme="dark"] #userManageMenu .helios-segmented {
    background-color: transparent;
}

/* Base buttons – fixed solid colors */
html[data-theme="dark"] #userManageMenu .helios-segmented .btn {
    background-color: #151e28;
    color: #cbd5e1;
    border-color: #2a3446;
}

/* Hover */
html[data-theme="dark"] #userManageMenu .helios-segmented .btn:hover {
    background-color: #1a2533;
    color: #ffffff;
}

/* Selected */
html[data-theme="dark"] #userManageMenu .helios-segmented .btn.is-selected {
    background-color: #2a3446;
    color: #ffffff;
    border-color: #3b4a63;
    font-weight: 600;
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] #userManageMenu .small.text-muted {
        color: #94a3b8 !important;
    }

    html[data-theme="auto"] #userManageMenu .helios-segmented .btn {
        background-color: #151e28;
        color: #cbd5e1;
        border-color: #2a3446;
    }

    html[data-theme="auto"] #userManageMenu .helios-segmented .btn:hover {
        background-color: #1a2533;
        color: #ffffff;
    }

    html[data-theme="auto"] #userManageMenu .helios-segmented .btn.is-selected {
        background-color: #2a3446;
        color: #ffffff;
        border-color: #3b4a63;
        font-weight: 600;
    }
}

/* ================================
   Helios – Dark mode
   Bootstrap form-switch tuning
   ================================ */

html[data-theme="dark"] .form-check-input[type="checkbox"] {
    background-color: #131b24;
    border-color: rgba(255, 255, 255, 0.25);
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23cbd5e1'/%3e%3c/svg%3e");
}

/* Checked state */
html[data-theme="dark"] .form-check-input:checked {
    background-color: var(--helios-blue);
    border-color: var(--helios-blue-strong);
}

/* Switch knob contrast (Bootstrap native SVG) */
html[data-theme="dark"] .form-check-input:checked {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
}

/* Focus state – subtle, Bootstrap-aligned */
html[data-theme="dark"] .form-check-input:focus {
    border-color: var(--helios-blue-strong);
    box-shadow: 0 0 0 0.15rem rgba(122, 167, 199, 0.25);
}

/* Disabled */
html[data-theme="dark"] .form-check-input:disabled {
    opacity: .5;
    cursor: not-allowed;
}

/* Auto mode */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .form-check-input[type="checkbox"] {
        background-color: #131b24;
        border-color: rgba(255, 255, 255, 0.25);
        --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23cbd5e1'/%3e%3c/svg%3e");
    }

    html[data-theme="auto"] .form-check-input:checked {
        background-color: var(--helios-blue);
        border-color: var(--helios-blue-strong);
    }

    html[data-theme="auto"] .form-check-input:checked {
        --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
    }

    html[data-theme="auto"] .form-check-input:focus {
        border-color: var(--helios-blue-strong);
        box-shadow: 0 0 0 0.15rem rgba(122, 167, 199, 0.25);
    }
}

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

/* ================================
   Success and Danger Subtle Badges (dark mode)
   ================================ */

html[data-theme="dark"] .badge.bg-success-subtle {
    background-color: rgba(74, 142, 71, 0.3) !important;
    border-color: rgba(74, 142, 71, 0.5) !important;
}

html[data-theme="dark"] .badge.bg-success-subtle.text-success {
    color: #60d345 !important;
}

html[data-theme="dark"] .badge.bg-danger-subtle {
    background-color: rgba(220, 78, 66, 0.3) !important;
    border-color: rgba(220, 78, 66, 0.5) !important;
}

html[data-theme="dark"] .badge.bg-danger-subtle.text-danger {
    color: #f87171 !important;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .badge.bg-success-subtle {
        background-color: rgba(74, 142, 71, 0.3) !important;
        border-color: rgba(74, 142, 71, 0.5) !important;
    }

    html[data-theme="auto"] .badge.bg-success-subtle.text-success {
        color: #60d345 !important;
    }

    html[data-theme="auto"] .badge.bg-danger-subtle {
        background-color: rgba(220, 78, 66, 0.3) !important;
        border-color: rgba(220, 78, 66, 0.5) !important;
    }

    html[data-theme="auto"] .badge.bg-danger-subtle.text-danger {
        color: #f87171 !important;
    }
}

/* ================================
   Select2 – Dark mode overrides
   ================================ */

html[data-theme="dark"] .select2-container--default .select2-selection--multiple {
    background-color: #141d27;
    border-color: rgba(95, 143, 179, 0.25);
}

html[data-theme="dark"] .select2-container--default .select2-selection--single {
    background-color: #141d27;
    border-color: rgba(95, 143, 179, 0.25);
    color: #e6eaf0;
}

html[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #e6eaf0;
}

html[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: rgba(230, 234, 240, 0.6);
}

html[data-theme="dark"] .select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: var(--helios-blue);
}

html[data-theme="dark"] .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--helios-blue);
}

html[data-theme="dark"] .select2-dropdown {
    background-color: #141d27;
    border-color: rgba(95, 143, 179, 0.25);
}

html[data-theme="dark"] .select2-results__option {
    color: #e6eaf0;
}

html[data-theme="dark"] .select2-results__option--highlighted {
    background-color: rgba(95, 143, 179, 0.15) !important;
    color: #e6eaf0 !important;
}

html[data-theme="dark"] .select2-results__option--selected {
    background-color: rgba(95, 143, 179, 0.15) !important;
    color: #e6eaf0 !important;
}

html[data-theme="dark"] .select2-results__option[aria-selected="true"] {
    background-color: rgba(95, 143, 179, 0.25) !important;
    color: #e6eaf0 !important;
}

html[data-theme="dark"] .select2-selection__choice {
    background: #5f8fb3 !important;
    border: 0 !important;
    color: #0f1720 !important;
}

html[data-theme="dark"] .select2-selection__choice__remove {
    color: #0f1720 !important;
    opacity: 0.8;
}

html[data-theme="dark"] .select2-selection__choice__remove:hover {
    opacity: 1;
}

/* Auto dark mode (OS preference) */
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .select2-container--default .select2-selection--multiple {
        background-color: #141d27;
        border-color: rgba(95, 143, 179, 0.25);
    }

    html[data-theme="auto"] .select2-container--default .select2-selection--single {
        background-color: #141d27;
        border-color: rgba(95, 143, 179, 0.25);
        color: #e6eaf0;
    }

    html[data-theme="auto"] .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #e6eaf0;
    }

    html[data-theme="auto"] .select2-container--default .select2-selection--single .select2-selection__placeholder {
        color: rgba(230, 234, 240, 0.6);
    }

    html[data-theme="auto"] .select2-container--default.select2-container--focus .select2-selection--multiple {
        border-color: var(--helios-blue);
    }

    html[data-theme="auto"] .select2-container--default.select2-container--focus .select2-selection--single {
        border-color: var(--helios-blue);
    }

    html[data-theme="auto"] .select2-dropdown {
        background-color: #141d27;
        border-color: rgba(95, 143, 179, 0.25);
    }

    html[data-theme="auto"] .select2-results__option {
        color: #e6eaf0;
    }

    html[data-theme="auto"] .select2-results__option--highlighted {
        background-color: rgba(95, 143, 179, 0.15) !important;
        color: #e6eaf0 !important;
    }

    html[data-theme="auto"] .select2-results__option--selected {
        background-color: rgba(95, 143, 179, 0.15) !important;
        color: #e6eaf0 !important;
    }

    html[data-theme="auto"] .select2-results__option[aria-selected="true"] {
        background-color: rgba(95, 143, 179, 0.25) !important;
        color: #e6eaf0 !important;
    }

    html[data-theme="auto"] .select2-selection__choice {
        background: #5f8fb3 !important;
        border: 0 !important;
        color: #0f1720 !important;
    }

    html[data-theme="auto"] .select2-selection__choice__remove {
        color: #0f1720 !important;
        opacity: 0.8;
    }

    html[data-theme="auto"] .select2-selection__choice__remove:hover {
        opacity: 1;
    }
}