/* ============================================
   LegalYes Dark Mode — Bootstrap 5.3 Color Modes
   Only custom LegalYes components & overrides.
   Bootstrap 5.3 data-bs-theme="dark" handles
   standard components natively.
   ============================================ */

/* --- CSS Variable Redefinitions --- */
[data-bs-theme="dark"] {
    /* Bootstrap 5.3 native dark vars — must override for proper card/body bg */
    --bs-body-bg: #0f172a;
    --bs-body-color: #e2e8f0;
    --bs-card-bg: #1e293b;
    --bs-card-color: #e2e8f0;
    --bs-card-border-color: #334155;
    --bs-card-cap-bg: #1e293b;
    --bs-border-color: #334155;
    --bs-tertiary-bg: #1e293b;
    /* DS vars */
    --bg-page: #0f172a;
    --bg-card: #1e293b;
    --bg-sidebar: #080e1a;
    --bg-sidebar-end: #0f172a;
    --bg-sidebar-hover: rgba(255,255,255,0.06);
    --text-on-dark: #e2e8f0;
    --text-primary: #e2e8f0;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;
    --text-white: #ffffff;
    --border: #334155;
    --border-light: #1e293b;
    --hover-bg: #253449;
    --primary: #6c7bf7;
    --primary-light: rgba(108,123,247,0.12);
    --primary-hover: #5a6be5;
    --success: #2dd4a0;
    --success-light: rgba(45,212,160,0.12);
    --warning: #f0b429;
    --warning-light: rgba(240,180,41,0.12);
    --danger: #f06b6b;
    --danger-light: rgba(240,107,107,0.12);
    --info: #4fa3e8;
    --info-light: rgba(79,163,232,0.12);
    --link-shadow: 0 1px 2px rgba(255,255,255,0.1);
    --link-shadow-hover: 0 1px 4px rgba(255,255,255,0.2);
    --link-inline-shadow: 0 1px 2px rgba(147,180,248,0.2);
    --link-inline-shadow-hover: 0 1px 4px rgba(147,180,248,0.3);
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.5);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.6);
    --shadow-xl: 0 16px 48px rgba(0,0,0,0.7);
    --folder-color: #fbbf24;

    /* Stronger scrim over already-dark page */
    --bs-backdrop-bg: #020617;
    --bs-backdrop-opacity: 0.72;
}

/* --- Custom -ly Components --- */
[data-bs-theme="dark"] .input-ly,
[data-bs-theme="dark"] .select-ly {
    background: var(--bg-card);
    color: var(--text-primary);
    border-color: var(--border);
}
[data-bs-theme="dark"] .input-ly:focus,
[data-bs-theme="dark"] .select-ly:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(129,140,248,0.2);
}
[data-bs-theme="dark"] .input-ly::placeholder { color: var(--text-muted); }
[data-bs-theme="dark"] .card-ly { background: var(--bg-card); border-color: var(--border); }
[data-bs-theme="dark"] .table-ly thead { background: var(--bg-page); }
[data-bs-theme="dark"] .table-ly tbody tr { border-color: var(--border); }
[data-bs-theme="dark"] .table-ly tbody tr:hover { background: var(--hover-bg); }
[data-bs-theme="dark"] .badge-ly.badge-muted { background: var(--border); color: var(--text-secondary); }
[data-bs-theme="dark"] .btn-secondary-ly { background: var(--bg-card); border-color: var(--border); color: var(--text-primary); }
[data-bs-theme="dark"] .btn-secondary-ly:hover { background: var(--hover-bg); border-color: var(--text-muted); }
[data-bs-theme="dark"] .breadcrumb-ly { color: var(--text-primary); }
[data-bs-theme="dark"] .stat-card { border-color: var(--border); }
[data-bs-theme="dark"] .pill { border-color: var(--border); color: var(--text-secondary); }
[data-bs-theme="dark"] .pill:hover { background: var(--hover-bg); color: var(--text-primary); }
[data-bs-theme="dark"] .btn-gdrive { border-color: var(--border); color: var(--text-secondary); }
[data-bs-theme="dark"] .btn-gdrive:hover { border-color: var(--text-muted); color: var(--text-primary); }
[data-bs-theme="dark"] .row-action.view { color: #93c5fd; }
[data-bs-theme="dark"] .row-action.view:hover {
    color: #e0f2fe;
    background: rgba(59, 130, 246, 0.2);
}
[data-bs-theme="dark"] .row-action.edit { color: #cbd5e1; }
[data-bs-theme="dark"] .row-action.edit:hover {
    color: #fde68a;
    background: rgba(245, 158, 11, 0.12);
}
[data-bs-theme="dark"] .row-action.delete { color: #f87171; }
[data-bs-theme="dark"] .row-action.delete:hover {
    color: #fecaca;
    background: rgba(239, 68, 68, 0.18);
}
[data-bs-theme="dark"] .row-action.pause { color: var(--warning); }
[data-bs-theme="dark"] .row-action.pause:hover {
    color: #fde68a;
    background: rgba(251, 191, 36, 0.15);
}
[data-bs-theme="dark"] .view-btn { color: var(--text-muted); border-color: var(--border); }
[data-bs-theme="dark"] .view-btn:hover,
[data-bs-theme="dark"] .view-btn.active { color: var(--primary); border-color: var(--primary); background: var(--primary-light); }
[data-bs-theme="dark"] .search-box { background: var(--bg-card); border-color: var(--border); }
[data-bs-theme="dark"] .settings-panel { background: var(--bg-card); }
[data-bs-theme="dark"] .sort-pill { border-color: var(--border); color: var(--text-secondary); }
[data-bs-theme="dark"] .filter-pills .pill { background: transparent; border-color: var(--border); color: var(--text-secondary); }
[data-bs-theme="dark"] .content { background: var(--bg-page); }
[data-bs-theme="dark"] .page-header,
[data-bs-theme="dark"] .breadcrumb-bar { background: var(--bg-card); border-color: var(--border); }

/* --- Doc type dots (keep original colors) --- */

/* --- Login page --- */
[data-bs-theme="dark"] .login-vertical-wrapper { background: var(--bg-card); border-top-color: var(--primary); box-shadow: 0 4px 24px rgba(0,0,0,0.3); }
[data-bs-theme="dark"] .login-vertical-wrapper h1,
[data-bs-theme="dark"] .login-vertical-wrapper p,
[data-bs-theme="dark"] .login-vertical-wrapper label { color: var(--text-primary); }
[data-bs-theme="dark"] .btn-google { border-color: var(--border); color: var(--text-secondary); }

/* --- Footer: card surface (not sidebar — avoids “too black” + halo mismatch) --- */
[data-bs-theme="dark"] footer.footer#footer,
[data-bs-theme="dark"] .footer {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
    border-top: 1px solid var(--border) !important;
    box-shadow: none !important;
}

[data-bs-theme="dark"] .footer a:not(.btn):not(.badge) {
    color: var(--text-secondary) !important;
    text-shadow: none !important;
}

[data-bs-theme="dark"] .footer a:not(.btn):not(.badge):hover {
    color: var(--primary) !important;
}

[data-bs-theme="dark"] .footer .footer-brand-title {
    color: var(--primary) !important;
}

[data-bs-theme="dark"] .footer .footer-section-title {
    color: var(--text-primary) !important;
}

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

[data-bs-theme="dark"] .footer .social-links a {
    color: var(--text-secondary) !important;
}

[data-bs-theme="dark"] .footer .social-links a:hover {
    color: var(--primary) !important;
}

[data-bs-theme="dark"] .footer .footer-social-links .footer-social-item {
    color: var(--text-secondary) !important;
}

[data-bs-theme="dark"] .footer .footer-social-links .footer-social-item:hover,
[data-bs-theme="dark"] .footer .footer-social-links .footer-social-item:focus-visible {
    color: var(--primary) !important;
}

[data-bs-theme="dark"] .footer .footer-social-icons a {
    color: var(--text-secondary) !important;
}

[data-bs-theme="dark"] .footer .footer-social-icons a:hover,
[data-bs-theme="dark"] .footer .footer-social-icons a:focus-visible {
    color: var(--primary) !important;
}

[data-bs-theme="dark"] .footer hr {
    border-top-color: var(--border) !important;
}

[data-bs-theme="dark"] .footer .footer-phone-reveal-btn {
    color: var(--text-secondary) !important;
    text-decoration: none !important;
}

[data-bs-theme="dark"] .footer .footer-phone-reveal-btn:hover,
[data-bs-theme="dark"] .footer .footer-phone-reveal-btn:focus-visible {
    color: var(--primary) !important;
    text-decoration: none !important;
}

[data-bs-theme="dark"] .footer .footer-contact-mailto,
[data-bs-theme="dark"] .footer .footer-phone-widget a {
    text-decoration: none !important;
}

[data-bs-theme="dark"] .footer .footer-toggle {
    background: var(--hover-bg) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-secondary) !important;
}

[data-bs-theme="dark"] .footer .footer-toggle:hover {
    background: var(--primary-light) !important;
    color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* --- Link styles dark mode — no glow, clean text --- */
[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item) {
    color: var(--text-primary);
    text-shadow: none;
}
[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):hover {
    color: var(--primary);
    text-shadow: none;
}
/* Inline links in dark mode — lighter primary, no glow */
[data-bs-theme="dark"] p a, [data-bs-theme="dark"] td a,
[data-bs-theme="dark"] li a, [data-bs-theme="dark"] span a,
[data-bs-theme="dark"] .text-link-inline {
    color: #93b4f8;
    text-shadow: none;
}
[data-bs-theme="dark"] p a:hover, [data-bs-theme="dark"] td a:hover,
[data-bs-theme="dark"] li a:hover, [data-bs-theme="dark"] span a:hover,
[data-bs-theme="dark"] .text-link-inline:hover {
    color: #b8d0fc;
    text-shadow: none;
}

[data-bs-theme="dark"] a.link-primary-ly,
[data-bs-theme="dark"] td a.link-primary-ly,
[data-bs-theme="dark"] h6 a.link-primary-ly {
    color: #93c5fd;
    text-shadow: none;
}
[data-bs-theme="dark"] a.link-primary-ly:hover,
[data-bs-theme="dark"] td a.link-primary-ly:hover,
[data-bs-theme="dark"] h6 a.link-primary-ly:hover {
    color: #bfdbfe;
    text-shadow: none;
}

/* --- Headings --- */
[data-bs-theme="dark"] h1, [data-bs-theme="dark"] h2,
[data-bs-theme="dark"] h3, [data-bs-theme="dark"] h4,
[data-bs-theme="dark"] h5, [data-bs-theme="dark"] h6 { color: var(--text-primary) !important; }
[data-bs-theme="dark"] p, [data-bs-theme="dark"] span,
[data-bs-theme="dark"] label, [data-bs-theme="dark"] small,
[data-bs-theme="dark"] li, [data-bs-theme="dark"] td,
[data-bs-theme="dark"] th, [data-bs-theme="dark"] dt,
[data-bs-theme="dark"] dd { color: var(--text-primary); }

/* --- DS Card overrides for dark mode --- */
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .ds-card,
[data-bs-theme="dark"] .card.ds-card {
    --bs-card-bg: var(--bg-card) !important;
    --bs-card-border-color: var(--border) !important;
    --bs-card-color: var(--text-primary) !important;
    --bs-card-cap-bg: var(--bg-card) !important;
    background-color: var(--bg-card) !important;
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
    box-shadow: var(--shadow-sm);
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .ds-card-header {
    background: var(--bg-card) !important;
    border-bottom-color: var(--border) !important;
    color: var(--text-primary);
}
[data-bs-theme="dark"] .card-body {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
    color: var(--text-primary);
}
[data-bs-theme="dark"] .ds-section-title {
    color: var(--text-primary);
}
[data-bs-theme="dark"] .ds-section-title i {
    color: var(--primary);
}
[data-bs-theme="dark"] .ds-subsection-title {
    color: var(--text-primary);
}
[data-bs-theme="dark"] .ds-subsection-title i {
    color: var(--primary);
}
[data-bs-theme="dark"] .ds-subsection-meta {
    color: var(--text-secondary);
}
/* DS: Filter card dark */
[data-bs-theme="dark"] .filter-card {
    background: var(--bg-card);
    border-color: var(--border);
}
/* DS: Stats bar dark */
[data-bs-theme="dark"] .stats-bar {
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
}
/* DS: Icon buttons dark */
[data-bs-theme="dark"] a.btn-icon,
[data-bs-theme="dark"] button.btn-icon {
    color: var(--text-muted) !important;
}
[data-bs-theme="dark"] a.btn-icon:hover,
[data-bs-theme="dark"] button.btn-icon:hover {
    background: var(--hover-bg) !important;
    color: var(--primary) !important;
}
/* DS: Table dark */
[data-bs-theme="dark"] .table {
    --bs-table-bg: var(--bg-card);
    --bs-table-hover-bg: var(--hover-bg);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .table thead th {
    background: var(--bg-page) !important;
    color: var(--text-secondary) !important;
    border-bottom-color: var(--border) !important;
}
[data-bs-theme="dark"] .table tbody td {
    border-bottom-color: var(--border) !important;
}
[data-bs-theme="dark"] .table-light {
    --bs-table-bg: var(--bg-page) !important;
}
/* DS: Form controls dark */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background: var(--bg-card);
    border-color: var(--border);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(129,140,248,0.2);
}
[data-bs-theme="dark"] .input-group-text {
    background: var(--bg-page) !important;
    border-color: var(--border);
    color: var(--text-muted);
}
/* DS: bg-white / bg-light overrides dark */
[data-bs-theme="dark"] .bg-white {
    background: var(--bg-card) !important;
}
[data-bs-theme="dark"] .bg-light {
    background: rgba(30, 41, 59, 0.6) !important;
}
[data-bs-theme="dark"] .card-header.bg-light {
    background: rgba(30, 41, 59, 0.6) !important;
    border-bottom-color: var(--border) !important;
}
[data-bs-theme="dark"] .card-header.bg-white {
    background: var(--bg-card) !important;
    border-bottom-color: var(--border) !important;
}
/* DS: border-rounded containers in dark */
[data-bs-theme="dark"] .border.rounded {
    border-color: var(--border) !important;
    background: var(--bg-card);
}
/* DS: Badge overrides dark */
[data-bs-theme="dark"] .badge.bg-light {
    background: var(--border) !important;
    color: var(--text-primary) !important;
}
/* DS: list-group dark */
[data-bs-theme="dark"] .list-group-item {
    background: var(--bg-card);
    border-color: var(--border);
    color: var(--text-primary);
}

/* --- Text color overrides dark --- */
[data-bs-theme="dark"] .text-dark {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .text-body {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .text-muted {
    color: var(--text-muted) !important;
}
/* --- Bootstrap border override dark --- */
[data-bs-theme="dark"] .border {
    border-color: var(--border) !important;
}
[data-bs-theme="dark"] .border-bottom {
    border-bottom-color: var(--border) !important;
}
[data-bs-theme="dark"] .border-top {
    border-top-color: var(--border) !important;
}
/* --- Bootstrap text-secondary dark --- */
[data-bs-theme="dark"] .text-secondary {
    color: var(--text-secondary) !important;
}
/* --- Nav tabs dark --- */
[data-bs-theme="dark"] .nav-tabs {
    border-bottom-color: var(--border);
}
[data-bs-theme="dark"] .nav-tabs .nav-link {
    color: var(--text-secondary);
}
[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    color: var(--text-primary);
    background: var(--bg-card);
    border-color: var(--border) var(--border) var(--bg-card);
}
[data-bs-theme="dark"] .nav-tabs .nav-link:hover:not(.active) {
    border-color: var(--border);
    color: var(--text-primary);
}
/* --- Btn outline dark mode --- */
[data-bs-theme="dark"] .btn-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
    background: transparent;
}
[data-bs-theme="dark"] .btn-outline-primary:hover {
    background: var(--primary);
    color: #fff;
}
[data-bs-theme="dark"] .btn-outline-secondary {
    color: var(--text-secondary);
    border-color: var(--border);
    background: transparent;
}
[data-bs-theme="dark"] .btn-outline-secondary:hover {
    background: var(--hover-bg);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .btn-outline-success {
    color: var(--success);
    border-color: var(--success);
    background: transparent;
}
[data-bs-theme="dark"] .btn-outline-warning {
    color: var(--warning);
    border-color: var(--warning);
    background: transparent;
}
/* Btn-group in dark mode — transparent bg for all outline buttons */
[data-bs-theme="dark"] .btn-group .btn-outline-primary,
[data-bs-theme="dark"] .btn-group .btn-outline-secondary {
    background: transparent !important;
}
[data-bs-theme="dark"] .btn-group .btn-outline-primary:hover {
    background: var(--primary) !important;
    color: #fff;
}
[data-bs-theme="dark"] .btn-group .btn-outline-secondary:hover {
    background: var(--hover-bg) !important;
}
/* Btn-check toggle (radio/checkbox) active state dark */
[data-bs-theme="dark"] .btn-check:checked + .btn-outline-primary,
[data-bs-theme="dark"] .btn-check:active + .btn-outline-primary {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}
[data-bs-theme="dark"] .btn-check:checked + .btn-outline-secondary,
[data-bs-theme="dark"] .btn-check:active + .btn-outline-secondary {
    background: var(--hover-bg) !important;
    border-color: var(--border) !important;
    color: var(--text-primary) !important;
}
/* DS: btn-primary dark — use DS primary */
[data-bs-theme="dark"] .btn-primary {
    --bs-btn-bg: var(--primary);
    --bs-btn-border-color: var(--primary);
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff;
}
[data-bs-theme="dark"] .btn-primary:hover {
    filter: brightness(1.1);
}
/* --- Table dark mode --- */
[data-bs-theme="dark"] .table {
    color: var(--text-primary);
    border-color: var(--border);
}
[data-bs-theme="dark"] .table > :not(caption) > * > * {
    background-color: var(--bg-card);
    color: var(--text-primary);
    border-bottom-color: var(--border);
}
[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: var(--bg-page);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .table thead th {
    background: var(--bg-page) !important;
    color: var(--text-secondary);
    border-bottom-color: var(--border);
}
[data-bs-theme="dark"] .table-hover > tbody > tr:hover > * {
    background-color: var(--hover-bg);
    color: var(--text-primary);
}
/* --- Form controls dark --- */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background: var(--bg-card);
    border-color: var(--border);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    background: var(--bg-card);
    border-color: var(--primary);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .form-control::placeholder {
    color: var(--text-muted);
}
[data-bs-theme="dark"] .form-check-label {
    color: var(--text-primary);
}
/* --- Modal dark --- */
[data-bs-theme="dark"] .modal-backdrop {
    background-color: var(--bs-backdrop-bg) !important;
}
[data-bs-theme="dark"] .modal-content {
    background: var(--bg-card);
    border-color: var(--border);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .modal-header {
    border-bottom-color: var(--border);
}
[data-bs-theme="dark"] .modal-footer {
    border-top-color: var(--border);
}
/* --- Dropdown dark --- */
[data-bs-theme="dark"] .dropdown-menu {
    background: var(--bg-card);
    border-color: var(--border);
}
[data-bs-theme="dark"] .dropdown-item {
    color: var(--text-primary);
}
[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
    background: var(--hover-bg);
    color: var(--text-primary);
}
/* --- Card title contrast --- */
[data-bs-theme="dark"] .card-title { color: var(--text-primary) !important; }
[data-bs-theme="dark"] .client-card-title,
[data-bs-theme="dark"] .client-name { color: var(--text-primary) !important; }

/* --- List group dark --- */
[data-bs-theme="dark"] .list-group-item {
    background: var(--bg-card);
    border-color: var(--border);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .list-group-item:hover {
    background: var(--hover-bg);
}
[data-bs-theme="dark"] .list-group-item.active {
    background: var(--primary);
    border-color: var(--primary);
}
/* --- Accordion dark --- */
[data-bs-theme="dark"] .accordion-item {
    background: var(--bg-card);
    border-color: var(--border);
}
[data-bs-theme="dark"] .accordion-button {
    background: var(--bg-card);
    color: var(--text-primary);
    border-color: var(--border);
}
[data-bs-theme="dark"] .accordion-button:not(.collapsed) {
    background: var(--hover-bg);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .accordion-body {
    background: var(--bg-card);
    color: var(--text-primary);
}
/* --- Breadcrumb dark --- */
[data-bs-theme="dark"] .breadcrumb {
    color: var(--text-secondary);
}
[data-bs-theme="dark"] .breadcrumb-item a {
    color: var(--text-secondary);
}
[data-bs-theme="dark"] .breadcrumb-item.active {
    color: var(--text-primary);
}
[data-bs-theme="dark"] .breadcrumb-item + .breadcrumb-item::before {
    color: var(--text-muted);
}
/* --- Popover / Tooltip dark --- */
[data-bs-theme="dark"] .popover {
    background: var(--bg-card);
    border-color: var(--border);
}
[data-bs-theme="dark"] .popover-header {
    background: var(--bg-page);
    border-bottom-color: var(--border);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .popover-body {
    color: var(--text-primary);
}
/* --- Alert dark --- */
[data-bs-theme="dark"] .alert {
    border-color: var(--border);
}
/* --- Pagination dark --- */
[data-bs-theme="dark"] .page-link {
    background: var(--bg-card);
    border-color: var(--border);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .page-link:hover {
    background: var(--hover-bg);
    color: var(--text-primary);
}
[data-bs-theme="dark"] .page-item.active .page-link {
    background: var(--primary);
    border-color: var(--primary);
}
[data-bs-theme="dark"] .page-item.disabled .page-link {
    background: var(--bg-page);
    color: var(--text-muted);
}
/* --- Progress bar dark --- */
[data-bs-theme="dark"] .progress {
    background: var(--bg-page);
}
/* --- Toast dark --- */
[data-bs-theme="dark"] .toast {
    background: var(--bg-card);
    border-color: var(--border);
    color: var(--text-primary);
}
/* --- Offcanvas dark --- */
[data-bs-theme="dark"] .offcanvas {
    background: var(--bg-card);
    color: var(--text-primary);
}
/* --- Nav pills dark --- */
[data-bs-theme="dark"] .nav-pills .nav-link {
    color: var(--text-secondary);
}
[data-bs-theme="dark"] .nav-pills .nav-link.active {
    background: var(--primary);
    color: #fff;
}
[data-bs-theme="dark"] .nav-pills .nav-link:hover:not(.active) {
    color: var(--text-primary);
    background: var(--hover-bg);
}

/* --- Scrollbar --- */
[data-bs-theme="dark"] ::-webkit-scrollbar-track { background: var(--bg-page); }
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb { background: var(--border); }
[data-bs-theme="dark"] * { scrollbar-color: var(--border) var(--bg-page); }

/* Task details: client folder links — #taskDetailsContainer wins over global dark anchor rule */
[data-bs-theme="dark"] #taskDetailsContainer a.client-folder-link {
    color: var(--text-primary);
    text-shadow: none;
}
[data-bs-theme="dark"] #taskDetailsContainer a.client-folder-link:hover {
    color: var(--primary);
    text-shadow: none;
}
[data-bs-theme="dark"] #taskDetailsContainer a.client-folder-link.main-folder {
    color: var(--info);
}
[data-bs-theme="dark"] #taskDetailsContainer a.client-folder-link.main-folder:hover {
    color: var(--text-primary);
}

/* --- Transition for smooth theme switching --- */
html, html * {
    transition: background-color 0.2s ease, color 0.15s ease, border-color 0.2s ease;
}
html .sidebar, html .header,
html .badge-ly, html .action-btn,
html iframe, html img {
    transition: none;
}