/* ============================================================
   Platinum CRM — Dark Mode Overrides
   Consolidated [data-theme="dark"] rules from theme.css
   ============================================================

   Table of Contents
   -----------------
   1.  Dark Token Overrides
   2.  Body
   3.  Scrollbar
   4.  Cards
   5.  Tables
   6.  Forms & Inputs
   7.  Content Header
   8.  Account Dropdown
   9.  Sidebar & Navbar
   10. Main Content
   11. Dropdowns
   12. Buttons
   13. Backgrounds
   14. Text Helpers
   15. Breadcrumbs
   16. Badges
   17. Page Backgrounds
   18. Page Headers
   19. Headings
   20. Icon Boxes
   21. Progress
   22. Alerts
   23. Search & Filter Panel
   24. Selection
   25. HR & Dividers
   26. Theme Toggle
   27. Glass Effects
   28. Notifications
   29. Charts
   30. Modals
   31. Tooltips
   32. Clickable Rows
   33. Gradient Backgrounds (bg-modern)
   34. Form Stepper
   35. Skeleton (tokens only — via section 1)
   ============================================================ */


/* ============================================================
   1. Dark Token Overrides
   ============================================================ */
[data-theme="dark"] {
    --bs-body-bg: var(--dark-bg-body);
    --bs-body-color: var(--dark-text-primary);
    --bs-heading-color: var(--dark-text-primary);
    --bs-border-color: var(--dark-border);
    --bs-card-bg: var(--dark-bg-surface);
    --bs-card-border-color: var(--dark-border);
    --bs-gray-50: #13151e;
    --bs-gray-100: var(--dark-bg-surface);
    --bs-gray-200: var(--dark-bg-elevated);
    --bs-gray-300: var(--dark-bg-overlay);
    --text-heading: var(--dark-text-primary);
    --text-sub: var(--dark-text-secondary);
    --border-light: var(--dark-border);
    --shadow-card: var(--dark-shadow-card);
    --shadow-dropdown: var(--dark-shadow-dropdown);
    --glass-bg: rgba(26, 29, 39, 0.82);
    --glass-border: rgba(255, 255, 255, 0.06);
    --skeleton-base: #222633;
    --skeleton-shine: #2a2e3d;
    color-scheme: dark;
}


/* ============================================================
   2. Body
   ============================================================ */
[data-theme="dark"] body,
[data-theme="dark"].body-dark {
    background-color: var(--dark-bg-body);
    color: var(--dark-text-primary);
}


/* ============================================================
   3. Scrollbar
   ============================================================ */
[data-theme="dark"] {
    scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
}

[data-theme="dark"]::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"]::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.25);
}


/* ============================================================
   4. Cards
   ============================================================ */
[data-theme="dark"] .card {
    --bs-card-bg: var(--dark-bg-surface);
    --bs-card-border-color: var(--dark-border);
    --bs-card-box-shadow: var(--dark-shadow-card);
}

[data-theme="dark"] .card:hover {
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .card-flush {
    background: rgba(26, 29, 39, 0.5);
    border-color: rgba(255, 255, 255, 0.04);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] .card-stat-glass {
    background: rgba(26, 29, 39, 0.6);
    border-color: var(--dark-border);
    box-shadow: var(--dark-shadow-card);
}

[data-theme="dark"] .card-stat {
    background: var(--dark-bg-surface);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.15);
}

[data-theme="dark"] .card-stat:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3), 0 1px 3px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .stat-icon-box.text-primary   { background: var(--soft-primary-bg-hover);   }
[data-theme="dark"] .stat-icon-box.text-success   { background: var(--soft-success-bg-hover);   }
[data-theme="dark"] .stat-icon-box.text-danger    { background: var(--soft-danger-bg-hover);    }
[data-theme="dark"] .stat-icon-box.text-warning   { background: var(--soft-warning-bg-hover);   }
[data-theme="dark"] .stat-icon-box.text-info      { background: var(--soft-info-bg-hover);      }
[data-theme="dark"] .stat-icon-box.text-secondary { background: var(--soft-secondary-bg-hover); }

[data-theme="dark"] .stat-card-value {
    color: var(--dark-text-primary);
}

[data-theme="dark"] .stat-card-label {
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .card-header,
[data-theme="dark"] .card-footer {
    background-color: var(--dark-bg-elevated);
    border-color: var(--dark-border);
}

[data-theme="dark"] .card-section-header,
[data-theme="dark"] .card-section-footer {
    background-color: var(--dark-bg-surface);
    border-color: var(--dark-border);
}


/* ============================================================
   5. Tables
   ============================================================ */
[data-theme="dark"] .table {
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--dark-border);
    --bs-table-hover-bg: rgba(255, 255, 255, 0.03);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.02);
    --bs-table-color: var(--dark-text-primary);
}
[data-theme="dark"] .table-responsive-wrapper {
    scrollbar-color: rgba(255,255,255,.06) transparent;
}
[data-theme="dark"] .table-responsive-wrapper::-webkit-scrollbar-track {
    background: rgba(255,255,255,.015);
}
[data-theme="dark"] .table-responsive-wrapper::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.06);
}
[data-theme="dark"] .table-responsive-wrapper::-webkit-scrollbar-thumb:hover {
    background: rgba(255,255,255,.1);
}
[data-theme="dark"] .table-responsive-wrapper::-webkit-scrollbar-thumb:active {
    background: rgba(255,255,255,.1);
}
[data-theme="dark"] .table-responsive-wrapper > .table {
    background: var(--dark-bg-surface);
}

[data-theme="dark"] .table-head-light th {
    background: var(--dark-bg-elevated);
    color: var(--dark-text-secondary);
}


/* ============================================================
   6. Forms & Inputs
   ============================================================ */
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
    background-color: var(--dark-bg-elevated);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
    color-scheme: dark;
}

[data-theme="dark"] .form-select option {
    background-color: var(--dark-bg-elevated);
    color: var(--dark-text-primary);
}

[data-theme="dark"] .form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23adb5bd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus {
    background-color: var(--dark-bg-overlay);
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.15);
}

[data-theme="dark"] .form-control::placeholder {
    color: var(--dark-text-muted);
}

[data-theme="dark"] .form-label {
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .input-group .input-group-text {
    background-color: var(--dark-bg-elevated);
    border-color: var(--dark-border);
    color: var(--dark-text-secondary);
}


/* ============================================================
   7. Content Header
   ============================================================ */
[data-theme="dark"] .content-header {
    background: linear-gradient(
        to bottom,
        rgba(26, 29, 39, 0.92),
        rgba(26, 29, 39, 0.85)
    );
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    border-bottom: 1px solid var(--dark-border);
    box-shadow: none;
}

[data-theme="dark"] .mobile-header {
    background: linear-gradient(
        to bottom,
        rgba(26, 29, 39, 0.96),
        rgba(26, 29, 39, 0.92)
    );
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid var(--dark-border);
}

[data-theme="dark"] .mobile-header-btn {
    color: var(--dark-text-primary);
}

[data-theme="dark"] .mobile-header-sep {
    background: var(--dark-border);
}

[data-theme="dark"] .mobile-header-back {
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .mobile-header-title {
    color: var(--dark-text-primary);
}

[data-theme="dark"] .mobile-header-breadcrumb {
    color: var(--dark-text-muted);
}

[data-theme="dark"] .mobile-header-avatar.avatar-role-platform-admin i { color: var(--bs-warning); }
[data-theme="dark"] .mobile-header-avatar.avatar-role-platform i   { color: var(--bs-primary); }
[data-theme="dark"] .mobile-header-avatar.avatar-role-clinic i     { color: var(--bs-success); }
[data-theme="dark"] .mobile-header-avatar.avatar-role-staff i      { color: #8b5cf6; }
[data-theme="dark"] .mobile-header-avatar.avatar-role-patient i    { color: #34d399; }
[data-theme="dark"] .mobile-header-avatar.avatar-role-user i       { color: var(--bs-info); }

[data-theme="dark"] .header-divider {
    background-color: var(--dark-border);
}

[data-theme="dark"] .header-search .form-control,
[data-theme="dark"] .header-search .form-select {
    background-color: var(--dark-bg-overlay);
    border-color: transparent;
}

[data-theme="dark"] .header-search .form-control:hover,
[data-theme="dark"] .header-search .form-select:hover {
    background-color: var(--dark-bg-elevated);
    border-color: var(--dark-border);
}

[data-theme="dark"] .header-search .form-control,
[data-theme="dark"] .header-search .form-select {
    background-color: var(--dark-bg-elevated);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

[data-theme="dark"] .btn-icon-header {
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .btn-icon-header:hover {
    background: rgba(255, 255, 255, 0.08);
    color: var(--dark-text-primary);
}


/* ============================================================
   8. Account Dropdown
   ============================================================ */
[data-theme="dark"] .account-dropdown-toggle:hover,
[data-theme="dark"] .account-dropdown.show .account-dropdown-toggle {
    background-color: rgba(255, 255, 255, 0.06);
    border-color: var(--dark-border);
}

[data-theme="dark"] .account-dropdown-header {
    background: linear-gradient(135deg, var(--dark-bg-overlay) 0%, rgba(var(--bs-primary-rgb), 0.06) 100%);
    border-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .account-dropdown-name {
    color: var(--dark-text-primary);
}

[data-theme="dark"] .account-dropdown-email {
    color: var(--dark-text-muted);
}

[data-theme="dark"] .account-dropdown-role {
    background-color: rgba(var(--bs-primary-rgb), 0.15);
}

[data-theme="dark"] .account-dropdown-role.role-platform-admin {
    background: linear-gradient(135deg, rgba(255, 137, 86, 0.15), rgba(255, 196, 0, 0.15));
    color: #f0a050;
    border-color: rgba(255, 137, 86, 0.2);
}

[data-theme="dark"] .account-dropdown-role.role-clinic {
    background-color: rgba(0, 201, 167, 0.12);
    color: #40d9b5;
    border-color: rgba(0, 201, 167, 0.15);
}

[data-theme="dark"] .account-dropdown-role.role-staff {
    background-color: rgba(102, 16, 242, 0.15);
    color: #8b5cf6;
    border-color: rgba(102, 16, 242, 0.2);
}

[data-theme="dark"] .account-dropdown-role.role-patient {
    background-color: rgba(32, 201, 151, 0.15);
    color: #34d399;
    border-color: rgba(32, 201, 151, 0.2);
}

[data-theme="dark"] .account-dropdown-item {
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .account-dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.06);
    color: var(--dark-text-primary);
}

[data-theme="dark"] .account-dropdown-item:active {
    background-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .account-dropdown-icon.icon-settings {
    background-color: rgba(255, 255, 255, 0.06);
    color: var(--dark-text-muted);
}

[data-theme="dark"] .account-dropdown-item:hover .icon-settings {
    background-color: rgba(var(--bs-primary-rgb), 0.15);
    color: var(--bs-primary);
}

[data-theme="dark"] .account-dropdown-icon.icon-theme {
    background-color: rgba(99, 102, 241, 0.12);
    color: #818cf8;
}

[data-theme="dark"] .account-dropdown-icon.icon-signout {
    background-color: rgba(var(--bs-danger-rgb), 0.1);
}

[data-theme="dark"] .account-dropdown-signout:hover {
    background-color: rgba(var(--bs-danger-rgb), 0.08);
}

[data-theme="dark"] .account-dropdown-signout:hover .icon-signout {
    background-color: rgba(var(--bs-danger-rgb), 0.18);
}

[data-theme="dark"] .account-dropdown-menu {
    background: var(--dark-bg-surface);
    border-color: var(--dark-border);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .account-dropdown-divider {
    background: var(--dark-border);
}

[data-theme="dark"] .account-dropdown-trigger-name {
    color: var(--dark-text-primary);
}

[data-theme="dark"] .account-dropdown-trigger-role {
    color: var(--dark-text-muted);
}

[data-theme="dark"] .account-dropdown-trigger-role.role-platform-admin { color: #ffb547; }
[data-theme="dark"] .account-dropdown-trigger-role.role-platform       { color: #6ea8fe; }
[data-theme="dark"] .account-dropdown-trigger-role.role-clinic         { color: #2dd4bf; }
[data-theme="dark"] .account-dropdown-trigger-role.role-staff          { color: #a78bfa; }
[data-theme="dark"] .account-dropdown-trigger-role.role-patient        { color: #34d399; }
[data-theme="dark"] .account-dropdown-trigger-role.role-user           { color: #67e8f9; }

[data-theme="dark"] .account-dropdown-arrow {
    color: var(--dark-text-muted);
}

[data-theme="dark"] .theme-switch-track {
    background: var(--dark-border);
}

[data-theme="dark"] .theme-switch.active .theme-switch-track {
    background: #6366f1;
}

[data-theme="dark"] .avatar-icon-wrapper {
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .avatar-icon-wrapper.avatar-role-platform-admin { color: var(--bs-warning); }
[data-theme="dark"] .avatar-icon-wrapper.avatar-role-platform   { color: var(--bs-primary); }
[data-theme="dark"] .avatar-icon-wrapper.avatar-role-clinic     { color: var(--bs-success); }
[data-theme="dark"] .avatar-icon-wrapper.avatar-role-staff      { color: #8b5cf6; }
[data-theme="dark"] .avatar-icon-wrapper.avatar-role-patient    { color: #34d399; }
[data-theme="dark"] .avatar-icon-wrapper.avatar-role-user       { color: var(--bs-info); }

[data-theme="dark"] .account-dropdown-toggle:hover .avatar-icon-wrapper {
    filter: brightness(1.2);
}


/* ── Page Title Header (dark) ── */
[data-theme="dark"] .tsc-title { color: var(--dark-text-primary); }
[data-theme="dark"] .tsc-desc  { color: var(--dark-text-secondary); }


/* ============================================================
   9. Sidebar & Navbar
   ============================================================ */
[data-theme="dark"] .sidebar,
[data-theme="dark"] .sidebar[class*="bg-primary-"] {
    background: linear-gradient(180deg, #0f1118 0%, #0f1118 40%, #0e1525 100%) !important;
    box-shadow: 1px 0 0 var(--dark-border);
}

[data-theme="dark"] .navbar,
[data-theme="dark"] .navbar[class*="bg-primary-"] {
    background: linear-gradient(135deg, #0f1118 0%, #0e1525 100%) !important;
}

[data-theme="dark"] .sidebar .sidebar-brand-divider {
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.06), transparent);
}

[data-theme="dark"] .sidebar::after {
    background: linear-gradient(to top, #0d1525 5%, transparent);
}

[data-theme="dark"] .sidebar::before {
    opacity: 0.5;
}


/* ============================================================
   10. Main Content
   ============================================================ */
[data-theme="dark"] .main-content {
    background-color: var(--dark-bg-body);
}


/* ============================================================
   11. Dropdowns
   ============================================================ */
[data-theme="dark"] .dropdown-menu {
    --bs-dropdown-bg: var(--dark-bg-elevated);
    --bs-dropdown-border-color: var(--dark-border);
    --bs-dropdown-link-color: var(--dark-text-primary);
    --bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.06);
    --bs-dropdown-link-hover-color: #fff;
    --bs-dropdown-divider-bg: var(--dark-border);
    box-shadow: var(--dark-shadow-dropdown);
}

[data-theme="dark"] .dropdown-header {
    color: var(--dark-text-muted) !important;
}


/* ============================================================
   12. Buttons
   ============================================================ */
[data-theme="dark"] .btn-white {
    background-color: var(--dark-bg-elevated);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

[data-theme="dark"] .btn-ghost {
    background: var(--dark-bg-surface);
    border-color: var(--dark-border);
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .btn-ghost:hover {
    background: var(--dark-bg-elevated);
    border-color: rgba(255, 255, 255, 0.15);
    color: var(--dark-text-primary);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}


/* ============================================================
   13. Backgrounds
   ============================================================ */
[data-theme="dark"] .bg-white,
[data-theme="dark"] .bg-light {
    background-color: var(--dark-bg-surface) !important;
}

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


/* ============================================================
   14. Text Helpers
   ============================================================ */
[data-theme="dark"] .text-muted {
    color: var(--dark-text-muted) !important;
}

[data-theme="dark"] .text-heading {
    color: var(--dark-text-primary);
}

[data-theme="dark"] .text-sub {
    color: var(--dark-text-secondary);
}


/* ============================================================
   15. Breadcrumbs
   ============================================================ */
[data-theme="dark"] .breadcrumb .breadcrumb-link {
    color: var(--dark-text-secondary);
}


/* ============================================================
   16. Badges
   ============================================================ */
[data-theme="dark"] .badge-soft-primary,
[data-theme="dark"] .badge-soft-success,
[data-theme="dark"] .badge-soft-info,
[data-theme="dark"] .badge-soft-warning,
[data-theme="dark"] .badge-soft-danger,
[data-theme="dark"] .badge-soft-secondary {
    border: 1px solid rgba(255, 255, 255, 0.04);
}


/* ============================================================
   17. Page Backgrounds
   ============================================================ */
[data-theme="dark"] .page-bg-light {
    background: linear-gradient(180deg, var(--page-bg-tint-dark, #111420) 0%, var(--dark-bg-body) 30%);
}

/* Dark mode dynamic page background tints */
[data-theme="dark"] .page-bg-primary   { --page-bg-tint-dark: #0d1525; }
[data-theme="dark"] .page-bg-success   { --page-bg-tint-dark: #0b1a1a; }
[data-theme="dark"] .page-bg-info      { --page-bg-tint-dark: #0b171d; }
[data-theme="dark"] .page-bg-warning   { --page-bg-tint-dark: #1a150e; }
[data-theme="dark"] .page-bg-danger    { --page-bg-tint-dark: #1a0e14; }
[data-theme="dark"] .page-bg-secondary { --page-bg-tint-dark: #131518; }

[data-theme="dark"] .page-bg-flat {
    background-color: var(--dark-bg-body);
}



/* ============================================================
   19. Headings
   ============================================================ */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6 {
    color: var(--dark-text-primary);
}


/* ============================================================
   20. Icon Boxes
   ============================================================ */
[data-theme="dark"] .icon-box-primary   { background: var(--soft-primary-bg-hover); }
[data-theme="dark"] .icon-box-success   { background: var(--soft-success-bg-hover); }
[data-theme="dark"] .icon-box-info      { background: var(--soft-info-bg-hover); }
[data-theme="dark"] .icon-box-warning   { background: var(--soft-warning-bg-hover); }
[data-theme="dark"] .icon-box-danger    { background: var(--soft-danger-bg-hover); }
[data-theme="dark"] .icon-box-secondary { background: var(--soft-secondary-bg-hover); }


/* ============================================================
   21. Progress
   ============================================================ */
[data-theme="dark"] .progress-thin {
    background: var(--dark-bg-overlay);
}


/* ============================================================
   22. Alerts
   ============================================================ */
[data-theme="dark"] .alert {
    border-color: var(--dark-border);
}

[data-theme="dark"] .alert-warning-box {
    background: rgba(255, 193, 7, 0.1);
    border-color: rgba(255, 193, 7, 0.25);
}


/* ============================================================
   23. Search & Filter Panel
   ============================================================ */
[data-theme="dark"] .toolbar-search-bar {
    background: var(--dark-bg-surface);
    border-bottom-color: var(--dark-border);
}

[data-theme="dark"] .search-toolbar .form-control {
    background: var(--dark-bg-elevated);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

[data-theme="dark"] .filter-panel {
    background: var(--dark-bg-elevated);
    border-color: var(--dark-border);
}


/* ============================================================
   24. Selection
   ============================================================ */
[data-theme="dark"] ::selection {
    background: rgba(0, 105, 166, 0.3);
    color: #fff;
}

[data-theme="dark"] ::-moz-selection {
    background: rgba(0, 105, 166, 0.3);
    color: #fff;
}


/* ============================================================
   25. HR & Dividers
   ============================================================ */
[data-theme="dark"] hr {
    color: var(--dark-border);
}

[data-theme="dark"] .border-divider {
    border-color: var(--dark-border);
}


/* ============================================================
   26. Theme Toggle
   ============================================================ */
[data-theme="dark"] .theme-toggle {
    border-color: var(--dark-border);
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .theme-toggle:hover {
    background-color: var(--dark-bg-elevated);
    color: var(--dark-text-primary);
}


/* ============================================================
   27. Glass Effects
   ============================================================ */
[data-theme="dark"] .glass-card {
    background: rgba(26, 29, 39, 0.6);
    border-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .glass-navbar {
    background: rgba(15, 17, 23, 0.8);
    border-bottom-color: var(--dark-border);
}


/* ============================================================
   28. Notifications
   ============================================================ */
[data-theme="dark"] .notification-badge .badge-dot {
    border-color: var(--dark-bg-surface);
}

[data-theme="dark"] .notification-badge .badge-count {
    border-color: var(--dark-bg-surface);
}


/* ============================================================
   29. Charts
   ============================================================ */
[data-theme="dark"] .chart-period-tabs {
    background: var(--dark-bg-elevated);
}

[data-theme="dark"] .chart-period-tab.active {
    background: var(--dark-bg-overlay);
    color: var(--dark-text-primary);
}

/* ApexCharts dark mode overrides */
[data-theme="dark"] .apexcharts-text,
[data-theme="dark"] .apexcharts-title-text {
    fill: var(--dark-text-secondary) !important;
}

[data-theme="dark"] .apexcharts-gridline {
    stroke: var(--dark-border) !important;
}

[data-theme="dark"] .apexcharts-xaxis-tick,
[data-theme="dark"] .apexcharts-yaxis-tick {
    stroke: var(--dark-border) !important;
}

[data-theme="dark"] .apexcharts-tooltip {
    background: var(--dark-bg-elevated) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}


/* ============================================================
   30. Modals
   ============================================================ */
[data-theme="dark"] .modal-content {
    background: var(--dark-bg-surface);
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.4);
}

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


/* ============================================================
   31. Tooltips
   ============================================================ */
[data-theme="dark"] .tooltip {
    --bs-tooltip-bg: var(--dark-bg-overlay);
}


/* ============================================================
   32. Clickable Rows
   ============================================================ */
[data-theme="dark"] .clickable-row:hover {
    background-color: rgba(255, 255, 255, 0.03);
}


/* ============================================================
   33. Gradient Backgrounds (bg-modern)
   ============================================================ */
[data-theme="dark"] .bg-modern-1  { background: linear-gradient(135deg, #0d2a30 0%, #143338 40%, #1a3d44 100%); }
[data-theme="dark"] .bg-modern-2  { background: linear-gradient(135deg, #2a2010 0%, #332818 40%, #3d3020 100%); }
[data-theme="dark"] .bg-modern-3  { background: linear-gradient(135deg, #1a1c24 0%, #222430 40%, #2a2d3c 100%); }
[data-theme="dark"] .bg-modern-4  { background: linear-gradient(135deg, #142014 0%, #1c2a1c 40%, #243424 100%); }
[data-theme="dark"] .bg-modern-5  { background: linear-gradient(135deg, #2a1820 0%, #332028 40%, #3d2830 100%); }
[data-theme="dark"] .bg-modern-6  { background: linear-gradient(135deg, #2a2414 0%, #332c1a 40%, #3d3420 100%); }
[data-theme="dark"] .bg-modern-7  { background: linear-gradient(135deg, #161c22 0%, #1e2630 40%, #26303e 100%); }
[data-theme="dark"] .bg-modern-8  { background: linear-gradient(135deg, #2a1a0d 0%, #331f12 40%, #3d2818 100%); }
[data-theme="dark"] .bg-modern-9  { background: linear-gradient(135deg, #0d2230 0%, #142a38 40%, #1a3344 100%); }
[data-theme="dark"] .bg-modern-10 { background: linear-gradient(135deg, #1c1c1c 0%, #242424 40%, #2c2c2c 100%); }
[data-theme="dark"] .bg-modern-11 { background: linear-gradient(135deg, #142014 0%, #1c2a1c 40%, #243424 100%); }
[data-theme="dark"] .bg-modern-12 { background: linear-gradient(135deg, #1e1828 0%, #262030 40%, #2e2838 100%); }
[data-theme="dark"] .bg-modern-13 { background: linear-gradient(135deg, #181818 0%, #202020 40%, #282828 100%); }
[data-theme="dark"] .bg-modern-14 { background: linear-gradient(135deg, #221828 0%, #2a2030 40%, #322838 100%); }
[data-theme="dark"] .bg-modern-15 { background: linear-gradient(135deg, #0d2230 0%, #142a38 40%, #1a3344 100%); }


/* ============================================================
   34. Form Stepper
   ============================================================ */
[data-theme="dark"] .form-stepper-step:hover {
    background: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .form-stepper-num {
    border-color: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.4);
}

[data-theme="dark"] .form-stepper-label {
    color: rgba(255, 255, 255, 0.4);
}

[data-theme="dark"] .form-stepper-connector {
    background: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .form-stepper-step.active {
    background: rgba(13, 110, 253, 0.1);
    border-color: rgba(13, 110, 253, 0.2);
}

[data-theme="dark"] .form-stepper-step.active .form-stepper-label {
    color: var(--bs-primary, #3d8bfd);
}

[data-theme="dark"] .form-stepper-step.completed .form-stepper-label {
    color: rgba(255, 255, 255, 0.85);
}

[data-theme="dark"] .form-stepper-connector.completed {
    background: var(--bs-success, #198754);
}

[data-theme="dark"] .form-section-title {
    color: rgba(255, 255, 255, 0.9);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .form-submit-bar {
    background: rgba(26, 29, 39, 0.85);
    border-top-color: rgba(255, 255, 255, 0.06);
}



/* ============================================================
   35. Dashboard — KPI Cards, Dash Cards, Charts, Timeline
   ============================================================ */

/* ── KPI Cards ── */
[data-theme="dark"] .kpi-card {
    background: linear-gradient(135deg, rgba(0, 105, 166, 0.04) 0%, rgba(9, 165, 190, 0.03) 100%);
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .kpi-card:hover {
    background: linear-gradient(135deg, rgba(0, 105, 166, 0.07) 0%, rgba(9, 165, 190, 0.05) 100%);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
[data-theme="dark"] .kpi-card-value { color: var(--dark-text-primary); }
[data-theme="dark"] .kpi-card-label { color: var(--dark-text-muted); }
[data-theme="dark"] .kpi-card-compare { color: var(--dark-text-muted); }
[data-theme="dark"] .kpi-delta-up { color: #34d399; background: rgba(52, 211, 153, 0.12); }
[data-theme="dark"] .kpi-delta-down { color: #f87171; background: rgba(248, 113, 113, 0.12); }
[data-theme="dark"] .kpi-delta-flat { color: var(--dark-text-secondary); background: rgba(255, 255, 255, 0.06); }

/* ── Dash Cards (transparent glass) ── */
[data-theme="dark"] .dash-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.015) 100%);
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .dash-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}
[data-theme="dark"] .dash-card-header { border-bottom-color: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .dash-card-title { color: var(--dark-text-primary); }
[data-theme="dark"] .dash-card-footer {
    border-top-color: rgba(255, 255, 255, 0.04);
    background: rgba(255, 255, 255, 0.015);
}

/* ── Dash Table ── */
[data-theme="dark"] .dash-table th {
    color: var(--dark-text-muted);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .dash-table td {
    color: var(--dark-text-primary);
    border-bottom-color: rgba(255, 255, 255, 0.03);
}
[data-theme="dark"] .dash-table tr:hover td { background: rgba(255, 255, 255, 0.02); }
[data-theme="dark"] .dash-table-name { color: var(--dark-text-primary); }
[data-theme="dark"] .dash-table-sub { color: var(--dark-text-muted); }

/* ── Status Dot Inline ── */
[data-theme="dark"] .status-dot-inline { color: var(--dark-text-secondary); }

/* ── Schedule Timeline ── */
[data-theme="dark"] .schedule-timeline-item { border-bottom-color: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .schedule-timeline-item:hover { background: rgba(255, 255, 255, 0.02); }
[data-theme="dark"] .schedule-time { color: var(--dark-text-muted); }
[data-theme="dark"] .schedule-name { color: var(--dark-text-primary); }
[data-theme="dark"] .schedule-status-done { color: var(--dark-text-muted); background: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .schedule-status-inroom { color: #34d399; background: rgba(52, 211, 153, 0.12); }
[data-theme="dark"] .schedule-status-waiting { color: #fbbf24; background: rgba(251, 191, 36, 0.12); }

/* ── Priority Task Items ── */
[data-theme="dark"] .priority-task-item { border-bottom-color: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .priority-task-item:hover { background: rgba(255, 255, 255, 0.02); }
[data-theme="dark"] .priority-task-title { color: var(--dark-text-primary); }
[data-theme="dark"] .priority-task-meta { color: var(--dark-text-muted); }

/* ── Quick Action Grid ── */
[data-theme="dark"] .quick-action-btn {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.06);
    color: var(--dark-text-primary);
}
[data-theme="dark"] .quick-action-btn i { color: var(--dark-text-secondary); }
[data-theme="dark"] .quick-action-btn:hover {
    background: rgba(0, 105, 166, 0.1);
    border-color: rgba(0, 105, 166, 0.2);
    color: #60a5fa;
}
[data-theme="dark"] .quick-action-btn:hover i { color: #60a5fa; }

/* ── Metric Rate Cards ── */
[data-theme="dark"] .metric-rate-card { background: rgba(255, 255, 255, 0.03) !important; }
[data-theme="dark"] .metric-rate-value { color: var(--dark-text-primary); }

/* ── Soft Background Overrides ── */
[data-theme="dark"] .bg-primary-subtle { background: rgba(0, 105, 166, 0.12) !important; }
[data-theme="dark"] .bg-success-subtle { background: rgba(0, 201, 167, 0.12) !important; }
[data-theme="dark"] .bg-warning-subtle { background: rgba(255, 137, 86, 0.12) !important; }
[data-theme="dark"] .bg-danger-subtle  { background: rgba(237, 76, 120, 0.12) !important; }
[data-theme="dark"] .bg-info-subtle    { background: rgba(9, 165, 190, 0.12) !important; }

/* ── Dash Tab Pills ── */
[data-theme="dark"] .dash-tab-pills { background: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .dash-tab-pill { color: var(--dark-text-muted); }
[data-theme="dark"] .dash-tab-pill.active { background: rgba(255, 255, 255, 0.08); color: var(--dark-text-primary); box-shadow: none; }

/* ── Pipeline Board ── */
[data-theme="dark"] .pipeline-stage-column { background: rgba(255, 255, 255, 0.02); border-color: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .pipeline-stage-header { background: transparent; }
[data-theme="dark"] .pipeline-stage-header::after { opacity: 0.35; }
[data-theme="dark"] .pipeline-stage-count { background: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .pipeline-card { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.06); }
[data-theme="dark"] .pipeline-card:hover { background: rgba(255, 255, 255, 0.06); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25); }
[data-theme="dark"] .pipeline-card-title { color: var(--dark-text-primary); }
[data-theme="dark"] .stage-flow-node { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .stage-flow-node:hover { box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); }

/* ── Clinic Onboarding Pipeline (.copl-*) — dark theme ── */
[data-theme="dark"] .copl-toolbar,
[data-theme="dark"] .copl-list,
[data-theme="dark"] .copl-empty,
[data-theme="dark"] .copl-card {
    --copl-surface: var(--dark-bg-surface, #1a2027);
    --copl-surface-soft: rgba(255, 255, 255, 0.03);
    --copl-border: rgba(255, 255, 255, 0.06);
    --copl-border-strong: rgba(255, 255, 255, 0.1);
    --copl-text: var(--dark-text-primary, #e6ebf2);
    --copl-sub: var(--dark-text-muted, #94a3b8);
    --copl-muted: rgba(255, 255, 255, 0.45);
    --copl-accent-soft: rgba(99, 102, 241, 0.16);
    --copl-success-soft: rgba(16, 185, 129, 0.14);
    --copl-warn-soft: rgba(245, 158, 11, 0.14);
    --copl-danger-soft: rgba(239, 68, 68, 0.14);
}
[data-theme="dark"] .copl-toolbar { background: var(--dark-bg-surface); }
[data-theme="dark"] .copl-toolbar-search input { background: rgba(255, 255, 255, 0.03); color: var(--dark-text-primary); }
[data-theme="dark"] .copl-toolbar-search input:focus { background: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .copl-phase-pills { background: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .copl-phase-pill:hover { background: rgba(255, 255, 255, 0.06); }
[data-theme="dark"] .copl-phase-pill.is-active {
    color: #fff;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, .4),
        0 4px 14px -2px rgba(99, 102, 241, .55),
        inset 0 1px 0 rgba(255, 255, 255, .15);
}
[data-theme="dark"] .copl-phase-pill.is-active i { color: #fff; }
[data-theme="dark"] .copl-phase-pill-count { background: rgba(255, 255, 255, 0.07); }
[data-theme="dark"] .copl-phase-pill.is-active .copl-phase-pill-count {
    background: rgba(255, 255, 255, .2);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1);
}
[data-theme="dark"] .copl-flag { background: rgba(255, 255, 255, 0.03); box-shadow: 0 1px 1px rgba(0, 0, 0, .25); }
[data-theme="dark"] .copl-flag:hover { box-shadow: 0 4px 12px -2px rgba(0, 0, 0, .4), 0 1px 2px rgba(0, 0, 0, .25); }
[data-theme="dark"] .copl-flag-count { background: rgba(255, 255, 255, 0.07); }
[data-theme="dark"] .cdir-toolbar-btn-count { background: rgba(255, 255, 255, .08); color: var(--dark-text-muted); }
[data-theme="dark"] .cdir-toolbar-btn.is-active .cdir-toolbar-btn-count { background: rgba(99, 102, 241, .25); color: #c7d2fe; }
[data-theme="dark"] .cdir-toolbar-dd {
    background: var(--dark-bg-surface);
    border-color: rgba(255, 255, 255, .08);
    box-shadow: 0 14px 36px -8px rgba(0, 0, 0, .55),
                0 4px 12px -4px rgba(0, 0, 0, .4),
                0 0 0 1px rgba(255, 255, 255, .03);
}
[data-theme="dark"] .cdir-toolbar-dd::before {
    background: var(--dark-bg-surface);
    border-top-color: rgba(255, 255, 255, .08);
    border-left-color: rgba(255, 255, 255, .08);
}
[data-theme="dark"] .cdir-toolbar-dd-header {
    color: var(--dark-text-muted);
    border-bottom-color: rgba(255, 255, 255, .06);
}
[data-theme="dark"] .cdir-toolbar-dd-item { color: var(--dark-text-primary); }
[data-theme="dark"] .cdir-toolbar-dd-item:hover,
[data-theme="dark"] .cdir-toolbar-dd-item:focus {
    background: rgba(255, 255, 255, .05);
    color: var(--dark-text-primary);
}
[data-theme="dark"] .cdir-toolbar-dd-item.active,
[data-theme="dark"] .cdir-toolbar-dd-item.active:hover,
[data-theme="dark"] .cdir-toolbar-dd-item.active:focus {
    background: rgba(99, 102, 241, .18);
    color: #c7d2fe;
}
[data-theme="dark"] .cdir-toolbar-dd-count { background: rgba(255, 255, 255, .08); color: var(--dark-text-muted); }
[data-theme="dark"] .cdir-toolbar-dd-item.active .cdir-toolbar-dd-count { background: rgba(99, 102, 241, .3); color: #c7d2fe; }
[data-theme="dark"] .cdir-toolbar-dd-check { color: #a5b4fc; }
[data-theme="dark"] .copl-card { background: var(--dark-bg-surface); }
[data-theme="dark"] .copl-card-head { background: linear-gradient(180deg, rgba(255,255,255,0.03) 0%, var(--dark-bg-surface) 100%); }
[data-theme="dark"] .copl-card-foot { background: rgba(255, 255, 255, 0.02); }
[data-theme="dark"] .copl-card-name { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-card-since { background: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .copl-card-open { background: rgba(255, 255, 255, 0.04); color: var(--dark-text-muted); }
[data-theme="dark"] .copl-card-open:hover { background: rgba(99, 102, 241, .15); color: #a5b4fc; border-color: rgba(99, 102, 241, .35); }
[data-theme="dark"] .copl-flag-badge--warn { background: rgba(245, 158, 11, .2); color: #fbbf24; }
[data-theme="dark"] .copl-flag-badge--ok   { background: rgba(16, 185, 129, .2); color: #6ee7b7; }

/* Unified directory toolbar — dark theme */
[data-theme="dark"] .cdir-toolbar {
    /* Dark-mode token overrides — must mirror the light-mode declarations
       in pipeline.css, otherwise the dropdown's `var(--copl-surface)` etc.
       fall back to the light values (or transparent for any missing token)
       and the menu can't render an opaque dark background. */
    --copl-surface: var(--dark-bg-surface, #1a2027);
    --copl-surface-soft: rgba(255, 255, 255, 0.04);
    --copl-border: rgba(255, 255, 255, 0.06);
    --copl-border-strong: rgba(255, 255, 255, 0.12);
    --copl-text: var(--dark-text-primary, #e2e8f0);
    --copl-sub: var(--dark-text-muted, #94a3b8);
    --copl-muted: rgba(148, 163, 184, .75);
    --copl-accent: #818cf8;
    --copl-accent-soft: rgba(99, 102, 241, .18);
    --copl-success: #34d399;
    --copl-success-soft: rgba(16, 185, 129, .18);
    --copl-warn: #fbbf24;
    --copl-warn-soft: rgba(245, 158, 11, .18);
    --copl-danger: #f87171;
    --copl-danger-soft: rgba(239, 68, 68, .18);

    background: rgba(255, 255, 255, .03);
    border-color: rgba(255, 255, 255, .06);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}
[data-theme="dark"] .cdir-toolbar-search input {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .08);
    color: var(--dark-text-primary);
}
[data-theme="dark"] .cdir-toolbar-search input:focus {
    background: rgba(255, 255, 255, .07);
    border-color: #818cf8;
    box-shadow: 0 0 0 3px rgba(129, 140, 248, .18);
}
[data-theme="dark"] .cdir-toolbar-search > i,
[data-theme="dark"] .cdir-toolbar-search-clear { color: var(--dark-text-muted); }
[data-theme="dark"] .cdir-toolbar-btn {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .08);
    color: var(--dark-text-muted);
}
[data-theme="dark"] .cdir-toolbar-btn:hover {
    color: var(--dark-text-primary);
    background: rgba(255, 255, 255, .07);
    border-color: rgba(255, 255, 255, .14);
}
[data-theme="dark"] .cdir-toolbar-btn.is-active,
[data-theme="dark"] .cdir-toolbar-btn[aria-expanded="true"] {
    color: #c7d2fe;
    background: rgba(99, 102, 241, .18);
    border-color: rgba(165, 180, 252, .35);
}
[data-theme="dark"] .cdir-toolbar-btn--ghost {
    background: transparent;
    border-color: rgba(255, 255, 255, .08);
}
[data-theme="dark"] .cdir-filter-panel { border-top-color: rgba(255, 255, 255, .08); }
[data-theme="dark"] .cdir-scope-toggle {
    background: rgba(255, 255, 255, .03);
    border-color: rgba(255, 255, 255, .08);
}
[data-theme="dark"] .cdir-scope-option:hover,
[data-theme="dark"] .cdir-scope-toggle > input[type="radio"]:checked + .cdir-scope-option {
    background: rgba(255, 255, 255, .06);
}
[data-theme="dark"] .cdir-scope-option__icon { background: rgba(255, 255, 255, .04); }
[data-theme="dark"] .cdir-scope-toggle > input[type="radio"]:checked + .cdir-scope-option .cdir-scope-option__icon { color: #fff; }

/* Info variant (onboarding-category chips) — dark theme */
[data-theme="dark"] .copl-flag--info {
    color: #c7d2fe;
    border-color: rgba(165, 180, 252, .25);
    background: linear-gradient(180deg, rgba(99, 102, 241, .08) 0%, rgba(99, 102, 241, .03) 100%);
}
[data-theme="dark"] .copl-flag--info i { color: #a5b4fc; }
[data-theme="dark"] .copl-flag--info:hover {
    background: linear-gradient(180deg, rgba(99, 102, 241, .22) 0%, rgba(99, 102, 241, .12) 100%);
    color: #e0e7ff;
    border-color: rgba(165, 180, 252, .55);
    box-shadow: 0 4px 14px -2px rgba(99, 102, 241, .35), 0 1px 2px rgba(0, 0, 0, .3);
}
[data-theme="dark"] .copl-flag--info.is-active {
    color: #fff;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    border-color: rgba(165, 180, 252, .65);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, .4),
        0 4px 14px -2px rgba(99, 102, 241, .55),
        inset 0 1px 0 rgba(255, 255, 255, .15);
}
[data-theme="dark"] .copl-flag--info.is-active i { color: #fff; }
[data-theme="dark"] .copl-flag--info.is-active .copl-flag-count {
    background: rgba(255, 255, 255, .2);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1);
}

/* Warn variant (Stuck) — dark theme */
[data-theme="dark"] .copl-flag--warn {
    background: linear-gradient(180deg, rgba(245, 158, 11, .08) 0%, rgba(245, 158, 11, .03) 100%);
    color: #fbbf24;
    border-color: rgba(245, 158, 11, .3);
}
[data-theme="dark"] .copl-flag--warn:hover {
    background: linear-gradient(180deg, rgba(245, 158, 11, .22) 0%, rgba(245, 158, 11, .12) 100%);
    color: #fcd34d;
    border-color: rgba(245, 158, 11, .55);
    box-shadow: 0 4px 14px -2px rgba(245, 158, 11, .3), 0 1px 2px rgba(0, 0, 0, .3);
}
[data-theme="dark"] .copl-flag--warn.is-active {
    color: #fff;
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    border-color: rgba(252, 211, 77, .6);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, .4),
        0 4px 14px -2px rgba(245, 158, 11, .5),
        inset 0 1px 0 rgba(255, 255, 255, .15);
}
[data-theme="dark"] .copl-flag--warn.is-active i { color: #fff; }
[data-theme="dark"] .copl-flag--warn.is-active .copl-flag-count {
    background: rgba(255, 255, 255, .2);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1);
}

/* Ok variant (Ready) — dark theme */
[data-theme="dark"] .copl-flag--ok {
    background: linear-gradient(180deg, rgba(16, 185, 129, .08) 0%, rgba(16, 185, 129, .03) 100%);
    color: #6ee7b7;
    border-color: rgba(16, 185, 129, .3);
}
[data-theme="dark"] .copl-flag--ok:hover {
    background: linear-gradient(180deg, rgba(16, 185, 129, .22) 0%, rgba(16, 185, 129, .12) 100%);
    color: #a7f3d0;
    border-color: rgba(16, 185, 129, .55);
    box-shadow: 0 4px 14px -2px rgba(16, 185, 129, .3), 0 1px 2px rgba(0, 0, 0, .3);
}
[data-theme="dark"] .copl-flag--ok.is-active {
    color: #fff;
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    border-color: rgba(110, 231, 183, .6);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, .4),
        0 4px 14px -2px rgba(16, 185, 129, .5),
        inset 0 1px 0 rgba(255, 255, 255, .15);
}
[data-theme="dark"] .copl-flag--ok.is-active i { color: #fff; }
[data-theme="dark"] .copl-flag--ok.is-active .copl-flag-count {
    background: rgba(255, 255, 255, .2);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1);
}
[data-theme="dark"] .copl-ring-percent { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-group { background: rgba(255, 255, 255, 0.03); }
[data-theme="dark"] .copl-group.is-progress { background: rgba(99, 102, 241, .12); border-color: rgba(99, 102, 241, .25); }
[data-theme="dark"] .copl-group.is-complete { background: rgba(16, 185, 129, .12); border-color: rgba(16, 185, 129, .3); }
[data-theme="dark"] .copl-group.is-complete .copl-group-icon { background: rgba(16, 185, 129, .2); color: #6ee7b7; }
[data-theme="dark"] .copl-group.is-complete .copl-group-label,
[data-theme="dark"] .copl-group.is-complete .copl-group-count { color: #6ee7b7; }
[data-theme="dark"] .copl-group-label,
[data-theme="dark"] .copl-group-count { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-next { background: rgba(99, 102, 241, .14); }
[data-theme="dark"] .copl-next:hover { background: rgba(99, 102, 241, .2); }
[data-theme="dark"] .copl-next-eyebrow { color: #a5b4fc; }
[data-theme="dark"] .copl-next-title { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-next-title i { color: #a5b4fc; }
[data-theme="dark"] .copl-next-cta { color: #a5b4fc; }
[data-theme="dark"] .copl-next--done { background: rgba(16, 185, 129, .14); }
[data-theme="dark"] .copl-next--done .copl-next-eyebrow,
[data-theme="dark"] .copl-next--done .copl-next-title i,
[data-theme="dark"] .copl-next--done .copl-next-cta { color: #6ee7b7; }
[data-theme="dark"] .copl-foot-meta { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-chip--lead     { background: rgba(99, 102, 241, .18); color: #a5b4fc; border-color: rgba(99, 102, 241, .3); }
[data-theme="dark"] .copl-chip--assignee { background: rgba(14, 165, 233, .18); color: #7dd3fc; border-color: rgba(14, 165, 233, .3); }
[data-theme="dark"] .copl-chip--ehr      { background: rgba(245, 158, 11, .18); color: #fbbf24; border-color: rgba(245, 158, 11, .3); }
[data-theme="dark"] .copl-chip--ehr.is-ok { background: rgba(16, 185, 129, .18); color: #6ee7b7; border-color: rgba(16, 185, 129, .3); }
[data-theme="dark"] .copl-chip--pending  { background: rgba(255, 255, 255, 0.05); color: var(--dark-text-muted); }
[data-theme="dark"] .copl-chip--plan     { background: rgba(124, 58, 237, .18); color: #c4b5fd; border-color: rgba(124, 58, 237, .3); }
[data-theme="dark"] .copl-foot-view { background: rgba(99, 102, 241, .15); color: #a5b4fc; }
[data-theme="dark"] .copl-foot-view:hover { background: #6366f1; color: #fff; }
[data-theme="dark"] .copl-empty { background: var(--dark-bg-surface); border-color: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .copl-empty h6 { color: var(--dark-text-primary); }

/* ── Workflow Builder ── */
[data-theme="dark"] .workflow-builder-container {
    background: radial-gradient(circle, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 20px 20px;
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .workflow-palette { background: rgba(255, 255, 255, 0.02); border-right-color: rgba(255, 255, 255, 0.06); }
[data-theme="dark"] .workflow-palette.wf-palette { background: linear-gradient(180deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.01) 100%); border-right-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .wf-palette-head { background: var(--dark-bg-surface, #1a2027); border-bottom-color: rgba(255,255,255,0.06); box-shadow: none; }
[data-theme="dark"] .wf-palette-brand-title { color: var(--dark-text-primary); }
[data-theme="dark"] .wf-palette-brand-sub { color: var(--dark-text-muted); }
[data-theme="dark"] .wf-palette-brand-icon { background: linear-gradient(135deg, rgba(0,105,166,0.22), rgba(0,201,167,0.2)); color: #4fb4e6; box-shadow: none; }
[data-theme="dark"] .wf-palette-brand-count { background: rgba(0,105,166,0.2); color: #4fb4e6; }
[data-theme="dark"] .wf-palette-search-input { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.08); color: var(--dark-text-primary); }
[data-theme="dark"] .wf-palette-search-input::placeholder { color: var(--dark-text-muted); }
[data-theme="dark"] .wf-palette-search-input:focus { background: rgba(255,255,255,0.05); border-color: rgba(0,105,166,0.5); box-shadow: 0 0 0 3px rgba(0,105,166,0.15); }
[data-theme="dark"] .wf-palette-search-icon { color: var(--dark-text-muted); }
[data-theme="dark"] .wf-palette-tabs { background: rgba(255,255,255,0.04); }
[data-theme="dark"] .wf-palette-tab { color: var(--dark-text-muted); }
[data-theme="dark"] .wf-palette-tab:hover { background: rgba(255,255,255,0.05); color: var(--dark-text-primary); }
[data-theme="dark"] .wf-palette-tab.is-active { background: rgba(255,255,255,0.08); color: #4fb4e6; box-shadow: 0 1px 3px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,105,166,0.25); }
[data-theme="dark"] .wf-palette-group { background: var(--dark-bg-surface, #1a2027); border-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .wf-palette-group:hover { border-color: rgba(0,105,166,0.25); }
[data-theme="dark"] .wf-palette-group-head:hover { background: rgba(0,105,166,0.05); }
[data-theme="dark"] .wf-palette-group-title { color: var(--dark-text-primary); }
[data-theme="dark"] .wf-palette-group-sub { color: var(--dark-text-muted); }
[data-theme="dark"] .wf-palette-group-count { background: rgba(255,255,255,0.06); color: var(--dark-text-muted); }
[data-theme="dark"] .wf-palette-group-chev { color: var(--dark-text-muted); }
[data-theme="dark"] .workflow-palette-node.wf-palette-node { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.05); color: var(--dark-text-primary); }
[data-theme="dark"] .workflow-palette-node.wf-palette-node:hover { background: rgba(0,105,166,0.12); border-color: rgba(0,105,166,0.35); box-shadow: 0 2px 8px rgba(0,0,0,0.25); }
[data-theme="dark"] .wf-palette-node-label { color: var(--dark-text-primary); }
[data-theme="dark"] .wf-palette-node-grip { color: rgba(255,255,255,0.15); }
[data-theme="dark"] .workflow-palette-node.wf-palette-node:hover .wf-palette-node-grip { color: #4fb4e6; }
[data-theme="dark"] .wf-palette-foot { background: var(--dark-bg-surface, #1a2027); border-top-color: rgba(255,255,255,0.06); color: var(--dark-text-muted); }
[data-theme="dark"] .wf-palette-empty-title { color: var(--dark-text-primary); }
[data-theme="dark"] .wf-palette-empty-sub { color: var(--dark-text-muted); }
[data-theme="dark"] .workflow-builder-container .drawflow .drawflow-node { background: var(--dark-bg-surface); border-color: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .workflow-node-body { color: var(--dark-text-primary); }
[data-theme="dark"] .workflow-node-body .node-description { color: var(--dark-text-muted); }

/* ── Insights Panel ── */
[data-theme="dark"] .insights-panel {
    background: linear-gradient(135deg, rgba(0, 201, 167, 0.05) 0%, rgba(0, 105, 166, 0.05) 100%);
    border-color: rgba(0, 201, 167, 0.1);
}

/* ── Progress Bars ── */
[data-theme="dark"] .progress { background: rgba(255, 255, 255, 0.06); }

/* ── Welcome Banner ── */
[data-theme="dark"] .welcome-banner {
    background: linear-gradient(135deg, #0d1525 0%, #162035 60%, #1a2540 100%);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

/* ── btn-soft overrides ── */
[data-theme="dark"] .btn-soft-primary { background: rgba(0, 105, 166, 0.15); color: #60a5fa; border-color: transparent; }
[data-theme="dark"] .btn-soft-primary:hover { background: rgba(0, 105, 166, 0.25); color: #93c5fd; }
[data-theme="dark"] .btn-soft-success { background: rgba(0, 201, 167, 0.15); color: #34d399; border-color: transparent; }
[data-theme="dark"] .btn-soft-success:hover { background: rgba(0, 201, 167, 0.25); }
[data-theme="dark"] .btn-outline-secondary { border-color: rgba(255, 255, 255, 0.12); color: var(--dark-text-secondary); }
[data-theme="dark"] .btn-outline-secondary:hover { background: rgba(255, 255, 255, 0.06); color: var(--dark-text-primary); border-color: rgba(255, 255, 255, 0.2); }

/* ============================================================
   36. Soft Tints — Dark Mode
   ============================================================ */
[data-theme="dark"] .bg-tint-primary   { background: rgba(0, 105, 166, 0.08) !important; }
[data-theme="dark"] .bg-tint-success   { background: rgba(0, 201, 167, 0.08) !important; }
[data-theme="dark"] .bg-tint-info      { background: rgba(9, 165, 190, 0.08) !important; }
[data-theme="dark"] .bg-tint-warning   { background: rgba(255, 137, 86, 0.08) !important; }
[data-theme="dark"] .bg-tint-danger    { background: rgba(237, 76, 120, 0.08) !important; }
[data-theme="dark"] .bg-tint-secondary { background: rgba(255, 255, 255, 0.04) !important; }

[data-theme="dark"] .stat-pill-primary   { color: #60a5fa; background: rgba(0, 105, 166, 0.15); border-color: rgba(0, 105, 166, 0.2); }
[data-theme="dark"] .stat-pill-success   { color: #34d399; background: rgba(0, 201, 167, 0.15); border-color: rgba(0, 201, 167, 0.2); }
[data-theme="dark"] .stat-pill-info      { color: #67e8f9; background: rgba(9, 165, 190, 0.15); border-color: rgba(9, 165, 190, 0.2); }
[data-theme="dark"] .stat-pill-warning   { color: #fbbf24; background: rgba(255, 137, 86, 0.15); border-color: rgba(255, 137, 86, 0.2); }
[data-theme="dark"] .stat-pill-danger    { color: #f87171; background: rgba(237, 76, 120, 0.15); border-color: rgba(237, 76, 120, 0.2); }
[data-theme="dark"] .stat-pill-secondary { color: var(--dark-text-secondary); background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.08); }

[data-theme="dark"] .icon-box-soft-primary   { background: rgba(0, 105, 166, 0.12); }
[data-theme="dark"] .icon-box-soft-success   { background: rgba(0, 201, 167, 0.12); }
[data-theme="dark"] .icon-box-soft-info      { background: rgba(9, 165, 190, 0.12); }
[data-theme="dark"] .icon-box-soft-warning   { background: rgba(255, 137, 86, 0.12); }
[data-theme="dark"] .icon-box-soft-danger    { background: rgba(237, 76, 120, 0.12); }

[data-theme="dark"] .empty-state-icon {
    background: linear-gradient(135deg, rgba(96, 165, 250, 0.18) 0%, rgba(96, 165, 250, 0.05) 100%);
    color: #60a5fa;
    box-shadow:
        inset 0 0 0 1px rgba(96, 165, 250, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 8px 20px -10px rgba(96, 165, 250, 0.35);
}
[data-theme="dark"] .empty-state-icon::before {
    background: radial-gradient(circle at 50% 40%, rgba(96, 165, 250, 0.12), transparent 70%);
}
[data-theme="dark"] .empty-state-title { color: var(--dark-text-primary); }
[data-theme="dark"] .empty-state-message { color: var(--dark-text-muted); }
[data-theme="dark"] .empty-state-hint   { color: var(--dark-text-muted); }

[data-theme="dark"] .empty-state-card {
    background: linear-gradient(180deg, var(--dark-surface-1, #0f172a) 0%, var(--dark-surface-2, #111b30) 100%);
    border-color: var(--dark-border, rgba(255, 255, 255, 0.08));
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.30), 0 14px 28px -16px rgba(0, 0, 0, 0.45);
}
[data-theme="dark"] .empty-state-card::before {
    background: radial-gradient(60% 100% at 50% 0%, rgba(96, 165, 250, 0.10), transparent 70%);
}

[data-theme="dark"] .empty-state-action--ghost {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.10);
    color: var(--dark-text-primary);
}
[data-theme="dark"] .empty-state-action--ghost:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.18);
    color: var(--dark-text-primary);
}

[data-theme="dark"] .empty-state-chip {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.08);
    color: var(--dark-text-primary);
}
[data-theme="dark"] .empty-state-chip-avatar {
    background: rgba(96, 165, 250, 0.14);
    color: #60a5fa;
}
[data-theme="dark"] .empty-state-chip-name { color: var(--dark-text-primary); }
[data-theme="dark"] .empty-state-chip-meta { color: var(--dark-text-muted); }
[data-theme="dark"] .empty-state-chip--more {
    color: var(--dark-text-muted);
    background: transparent;
    border-color: rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] .btn-glass {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.08);
    color: var(--dark-text-primary);
}
[data-theme="dark"] .btn-glass:hover {
    background: rgba(0, 105, 166, 0.1);
    border-color: rgba(0, 105, 166, 0.2);
    color: #60a5fa;
}
[data-theme="dark"] .btn-glass .btn-glass-icon { background: rgba(0, 105, 166, 0.15); color: #60a5fa; }

[data-theme="dark"] .kpi-card-tint-primary   { background: rgba(0, 105, 166, 0.06); border-color: rgba(0, 105, 166, 0.1); }
[data-theme="dark"] .kpi-card-tint-success   { background: rgba(0, 201, 167, 0.06); border-color: rgba(0, 201, 167, 0.1); }
[data-theme="dark"] .kpi-card-tint-info      { background: rgba(9, 165, 190, 0.06); border-color: rgba(9, 165, 190, 0.1); }
[data-theme="dark"] .kpi-card-tint-warning   { background: rgba(255, 137, 86, 0.06); border-color: rgba(255, 137, 86, 0.1); }
[data-theme="dark"] .kpi-card-tint-danger    { background: rgba(237, 76, 120, 0.06); border-color: rgba(237, 76, 120, 0.1); }

[data-theme="dark"] .dash-card-header-tint-primary   { background: rgba(0, 105, 166, 0.04); }
[data-theme="dark"] .dash-card-header-tint-success   { background: rgba(0, 201, 167, 0.04); }
[data-theme="dark"] .dash-card-header-tint-info      { background: rgba(9, 165, 190, 0.04); }
[data-theme="dark"] .dash-card-header-tint-warning   { background: rgba(255, 137, 86, 0.04); }
[data-theme="dark"] .dash-card-header-tint-danger    { background: rgba(237, 76, 120, 0.04); }

/* ── Quick Action Card + Items — Dark ── */
[data-theme="dark"] .quick-action-card { background: rgba(255, 255, 255, 0.02); border-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .quick-action-item { color: var(--dark-text-primary); }
[data-theme="dark"] .quick-action-item:hover { background: rgba(0, 105, 166, 0.08); color: #60a5fa; }
[data-theme="dark"] .quick-action-item-icon-primary   { background: rgba(0, 105, 166, 0.12); }
[data-theme="dark"] .quick-action-item-icon-success   { background: rgba(0, 201, 167, 0.12); }
[data-theme="dark"] .quick-action-item-icon-info      { background: rgba(9, 165, 190, 0.12); }
[data-theme="dark"] .quick-action-item-icon-warning   { background: rgba(255, 137, 86, 0.12); }
[data-theme="dark"] .quick-action-item-icon-danger    { background: rgba(237, 76, 120, 0.12); }
[data-theme="dark"] .quick-action-item-desc { color: var(--dark-text-muted); }

/* ── Pipeline template feature cards — Dark ── */
[data-theme="dark"] .pt-card {
    background: rgba(255, 255, 255, 0.025);
    border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .pt-card:hover,
[data-theme="dark"] .pt-card:focus-visible {
    background: rgba(255, 255, 255, 0.04);
    border-color: color-mix(in srgb, var(--pt-tint) 40%, transparent);
    box-shadow:
        0 14px 32px -14px color-mix(in srgb, var(--pt-tint) 35%, rgba(0, 0, 0, 0.6)),
        0 2px 6px rgba(0, 0, 0, 0.25);
}
[data-theme="dark"] .pt-card__title { color: var(--dark-text-primary); }
[data-theme="dark"] .pt-card__desc { color: var(--dark-text-muted); }
[data-theme="dark"] .pt-card__features li { color: var(--dark-text-primary); }
[data-theme="dark"] .pt-card__steps-label { color: var(--dark-text-muted); }
[data-theme="dark"] .pt-card__stat { color: var(--dark-text-muted); }
[data-theme="dark"] .pt-card__stat-sep { background: rgba(255, 255, 255, 0.25); }
[data-theme="dark"] .pt-card__footer { border-top-color: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .pt-card__pill--accent {
    background: color-mix(in srgb, var(--pt-tint) 18%, transparent);
    color: color-mix(in srgb, var(--pt-tint) 75%, #ffffff);
}
[data-theme="dark"] .pt-card__pill--muted {
    background: rgba(148, 163, 184, 0.15);
    color: var(--dark-text-muted);
}
[data-theme="dark"] .pt-card__tp {
    background: color-mix(in srgb, var(--pt-tint) 15%, transparent);
    border-color: color-mix(in srgb, var(--pt-tint) 30%, transparent);
    color: color-mix(in srgb, var(--pt-tint) 70%, #ffffff);
}
[data-theme="dark"] .wf-catalog-section { border-bottom-color: rgba(255, 255, 255, 0.04); }

/* Accordion panels — dark */
[data-theme="dark"] .wf-catalog-panel {
    background: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .wf-catalog-panel:hover { border-color: rgba(255, 255, 255, 0.1); }
[data-theme="dark"] .wf-catalog-panel-header:hover { background: rgba(255, 255, 255, 0.03); }
[data-theme="dark"] .wf-catalog-panel-header[aria-expanded="true"] { background: rgba(255, 255, 255, 0.025); }
[data-theme="dark"] .wf-catalog-chevron { color: var(--dark-text-muted); }
[data-theme="dark"] .wf-catalog-empty {
    background: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .text-purple { color: #a78bfa !important; }

/* ── Onboarding Progress Bar ── */
[data-theme="dark"] .onboard-step-dot {
    background: var(--dark-card-bg, #1a1d27);
    border-color: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.5);
}
[data-theme="dark"] .onboard-step-label { color: rgba(255, 255, 255, 0.4); }
[data-theme="dark"] .onboard-step-sub { color: rgba(255, 255, 255, 0.25); }
[data-theme="dark"] .onboard-connector { background: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .onboard-step.active .onboard-step-dot {
    background: var(--bs-primary, #3d8bfd);
    border-color: var(--bs-primary, #3d8bfd);
    box-shadow: 0 0 0 4px rgba(61, 139, 253, 0.2);
}
[data-theme="dark"] .onboard-step.active .onboard-step-label { color: var(--bs-primary, #3d8bfd); }
[data-theme="dark"] .onboard-step.active .onboard-step-sub { color: var(--bs-primary, #3d8bfd); }
[data-theme="dark"] .onboard-step.completed .onboard-step-label { color: rgba(255, 255, 255, 0.85); }
[data-theme="dark"] .onboard-step.completed .onboard-step-sub { color: var(--bs-success, #198754); }
[data-theme="dark"] .onboard-checklist { border-top-color: rgba(255, 255, 255, 0.06); }
[data-theme="dark"] .onboard-check-item.done { background: rgba(25, 135, 84, 0.1); }

/* ── Onboarding Hub (refined 2027 SaaS layout) ── */
[data-theme="dark"] .onboarding-hub {
    --oh-surface: var(--dark-card-bg, #1a1d27);
    --oh-surface-soft: rgba(255, 255, 255, 0.025);
    --oh-border: rgba(255, 255, 255, 0.06);
    --oh-border-strong: rgba(255, 255, 255, 0.1);
    --oh-text: rgba(255, 255, 255, 0.92);
    --oh-muted: rgba(255, 255, 255, 0.42);
    --oh-sub: rgba(255, 255, 255, 0.62);
    --oh-accent: #a5b4fc;
    --oh-accent-soft: rgba(99, 102, 241, 0.14);
    --oh-success: #6ee7b7;
    --oh-success-soft: rgba(16, 185, 129, 0.12);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
[data-theme="dark"] .onboarding-hub-header {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.02) 0%, transparent 100%);
}
[data-theme="dark"] .onboarding-step-meta {
    border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .onboarding-hub[data-percent="100"] .onboarding-ring-fill { stroke: var(--oh-success); }
[data-theme="dark"] .onboarding-step-item.is-done .onboarding-step-marker {
    background: var(--oh-success);
    color: #064e3b;
    border-color: var(--oh-success);
}
[data-theme="dark"] .onboarding-step-chip--success { color: #6ee7b7; }
[data-theme="dark"] .onboarding-step-chip--pending { color: #a5b4fc; }
[data-theme="dark"] .onboarding-step-chip--info { color: #67e8f9; }
[data-theme="dark"] .onboarding-step-chip--warning { color: #fcd34d; }
[data-theme="dark"] .onboarding-step-chip--danger { color: #fca5a5; }
[data-theme="dark"] .onboarding-substep.is-done .onboarding-substep-detail { color: #6ee7b7; }
[data-theme="dark"] .onboarding-group.is-complete .onboarding-group-count { color: #6ee7b7; }
[data-theme="dark"] .onboarding-next-action--success .onboarding-next-label,
[data-theme="dark"] .onboarding-next-action--success .onboarding-next-cta { color: #6ee7b7; }
[data-theme="dark"] .onboarding-group-icon { color: var(--oh-accent); }
[data-theme="dark"] .onboarding-group.is-complete .onboarding-group-icon { color: #6ee7b7; }
[data-theme="dark"] .onboarding-step-action .btn-soft-primary {
    background: var(--oh-accent-soft);
    color: var(--oh-accent);
}
[data-theme="dark"] .onboarding-step-action .btn-soft-primary:hover {
    background: var(--oh-accent);
    color: #1e1b4b;
}
[data-theme="dark"] .onboarding-step-action .btn-outline-secondary {
    border-color: var(--oh-border-strong);
    color: var(--oh-sub);
}
[data-theme="dark"] .onboarding-step-action .btn-outline-secondary:hover {
    background: rgba(255, 255, 255, 0.04);
    color: var(--oh-text);
}
[data-theme="dark"] .onboarding-substep { border-color: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .onboarding-substep-cta:hover {
    background: var(--oh-accent);
    color: #1e1b4b;
    border-color: var(--oh-accent);
}

/* Clinic detail tabs */
[data-theme="dark"] .clinic-detail-tabs {
    background: linear-gradient(180deg, rgba(255, 255, 255, .04) 0%, rgba(255, 255, 255, .015) 100%);
    border-color: rgba(255, 255, 255, .06);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .04),
        0 1px 2px rgba(0, 0, 0, .25);
}
[data-theme="dark"] .clinic-detail-tabs .nav-link {
    color: rgba(255, 255, 255, 0.55);
}
[data-theme="dark"] .clinic-detail-tabs .nav-link:hover {
    color: rgba(255, 255, 255, 0.92);
    background: rgba(255, 255, 255, .04);
}
[data-theme="dark"] .clinic-detail-tabs .nav-link.active {
    background: var(--dark-card-bg, #1a1d27);
    color: rgba(255, 255, 255, 0.96);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, .35),
        0 6px 16px -4px rgba(0, 0, 0, .4),
        0 0 0 1px rgba(255, 255, 255, .08);
}
[data-theme="dark"] .clinic-detail-tabs .nav-link.active i { color: #a5b4fc; }
[data-theme="dark"] .clinic-detail-tab-badge {
    background: rgba(99, 102, 241, .2);
    color: #a5b4fc;
}
[data-theme="dark"] .clinic-detail-tabs .nav-link:not(.active) .clinic-detail-tab-badge {
    background: rgba(255, 255, 255, 0.05);
    color: rgba(255, 255, 255, 0.6);
    border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .clinic-detail-tab-badge.is-complete {
    background: rgba(16, 185, 129, .2);
    color: #6ee7b7;
}
[data-theme="dark"] .clinic-detail-tabs .nav-link:not(.active) .clinic-detail-tab-badge.is-complete {
    background: rgba(16, 185, 129, 0.12);
    color: #6ee7b7;
    border-color: rgba(16, 185, 129, 0.25);
}

/* ── Clinic Details Tab ── */
[data-theme="dark"] .clinic-details {
    --d-surface: var(--dark-card-bg, #1a1d27);
    --d-surface-soft: rgba(255, 255, 255, 0.025);
    --d-border: rgba(255, 255, 255, 0.06);
    --d-border-strong: rgba(255, 255, 255, 0.1);
    --d-text: rgba(255, 255, 255, 0.92);
    --d-sub: rgba(255, 255, 255, 0.62);
    --d-muted: rgba(255, 255, 255, 0.42);
    --d-accent: #a5b4fc;
    --d-accent-soft: rgba(99, 102, 241, 0.14);
    --d-success: #6ee7b7;
    --d-success-soft: rgba(16, 185, 129, 0.14);
    --d-warning: #fcd34d;
    --d-warning-soft: rgba(245, 158, 11, 0.14);
    --d-info: #7dd3fc;
    --d-info-soft: rgba(14, 165, 233, 0.14);
    --d-danger: #fca5a5;
    --d-danger-soft: rgba(239, 68, 68, 0.14);
}
[data-theme="dark"] .details-hero,
[data-theme="dark"] .details-section,
[data-theme="dark"] .details-stat {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
[data-theme="dark"] .details-stat:hover {
    box-shadow: 0 8px 20px -12px rgba(0, 0, 0, 0.5);
}
[data-theme="dark"] .details-pill--success { color: #6ee7b7; }
[data-theme="dark"] .details-pill--info    { color: #7dd3fc; }
[data-theme="dark"] .details-pill--warning { color: #fcd34d; }
[data-theme="dark"] .details-pill--danger  { color: #fca5a5; }
[data-theme="dark"] .details-icon--success { color: #6ee7b7; }
[data-theme="dark"] .details-icon--info    { color: #7dd3fc; }
[data-theme="dark"] .details-icon--warning { color: #fcd34d; }
[data-theme="dark"] .details-stat[data-tone="success"] .details-stat-icon { color: #6ee7b7; }
[data-theme="dark"] .details-stat[data-tone="info"]    .details-stat-icon { color: #7dd3fc; }
[data-theme="dark"] .details-stat[data-tone="warning"] .details-stat-icon { color: #fcd34d; }
[data-theme="dark"] .details-loc-marker { color: #6ee7b7; }
[data-theme="dark"] .details-tag--success { color: #6ee7b7; }
[data-theme="dark"] .details-tag--warning { color: #fcd34d; }
[data-theme="dark"] .details-tag--info    { color: #7dd3fc; }
[data-theme="dark"] .details-ehr-card.is-connected .details-section-title i { color: #6ee7b7; }
[data-theme="dark"] .details-info-value a { color: #a5b4fc; }

/* Patient & Staff avatar variants */
[data-theme="dark"] .details-prov-avatar--patient { color: #7dd3fc; }
[data-theme="dark"] .details-prov-avatar--staff   { color: #fcd34d; }

/* Connected accounts */
[data-theme="dark"] .details-account-tile.is-connected .details-account-tile-status { color: #6ee7b7; }
[data-theme="dark"] .details-account-tile-icon--google   { color: #8ab4f8; }
[data-theme="dark"] .details-account-tile-icon--facebook { color: #6ea8fe; }


/* Onboarding Pipeline overview/controls — dark theme */
[data-theme="dark"] .copl-overview {
    background: var(--dark-bg-surface, #1a2027);
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .copl-overview-head {
    background: linear-gradient(180deg, rgba(255,255,255,0.03) 0%, var(--dark-bg-surface) 100%);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .copl-overview-title { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-overview-title i { color: #a5b4fc; }
[data-theme="dark"] .copl-overview-sub { color: var(--dark-text-muted); }

[data-theme="dark"] .copl-overview-ring-track { stroke: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .copl-overview-ring-percent { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-overview-ring-sub { color: var(--dark-text-muted); }

[data-theme="dark"] .copl-tile {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .copl-tile-num { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-tile-lbl { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-tile--primary .copl-tile-icon { background: rgba(99, 102, 241, .18); color: #a5b4fc; }
[data-theme="dark"] .copl-tile--success .copl-tile-icon { background: rgba(16, 185, 129, .2); color: #6ee7b7; }
[data-theme="dark"] .copl-tile--warn    .copl-tile-icon { background: rgba(245, 158, 11, .2); color: #fbbf24; }
[data-theme="dark"] .copl-tile--accent  .copl-tile-icon { background: rgba(124, 58, 237, .2); color: #c4b5fd; }

[data-theme="dark"] .copl-universe-strip {
    background: linear-gradient(180deg, var(--dark-bg-surface) 0%, rgba(255,255,255,.02) 100%);
    border-top-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .copl-universe-pill {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.08);
    color: var(--dark-text-muted);
}
[data-theme="dark"] .copl-universe-pill:hover { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.14); }
[data-theme="dark"] .copl-universe-pill strong { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-universe-pill-lbl { color: var(--dark-text-secondary); }
[data-theme="dark"] .copl-universe-pill-pct { color: rgba(255, 255, 255, 0.4); }
[data-theme="dark"] .copl-universe-pill--synced strong { color: #6ee7b7; }
[data-theme="dark"] .copl-universe-pill--crm strong    { color: #93c5fd; }
[data-theme="dark"] .copl-universe-pill--ehr strong    { color: #c4b5fd; }

[data-theme="dark"] .copl-attention-card {
    background: var(--dark-bg-surface, #1a2027);
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}
[data-theme="dark"] .copl-attention-num { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-attention-lbl { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-attention-arrow { color: rgba(255, 255, 255, 0.3); }
[data-theme="dark"] .copl-attention-card--warn   { --ac-icon-bg: rgba(245, 158, 11, .2); --ac-icon-fg: #fbbf24; }
[data-theme="dark"] .copl-attention-card--accent { --ac-icon-bg: rgba(124, 58, 237, .22); --ac-icon-fg: #c4b5fd; }
[data-theme="dark"] .copl-attention-card--ok     { --ac-icon-bg: rgba(16, 185, 129, .2); --ac-icon-fg: #6ee7b7; }

[data-theme="dark"] .copl-overview-block {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .copl-overview-block-title { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-overview-block-title i { color: #a5b4fc; }
[data-theme="dark"] .copl-overview-block-sub { color: var(--dark-text-muted); }

[data-theme="dark"] .copl-phase-bar { background: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .copl-phase-bar-seg + .copl-phase-bar-seg { border-left-color: var(--dark-bg-surface); }
[data-theme="dark"] .copl-overview-legend-item { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-overview-legend-item strong { color: var(--dark-text-primary); }

[data-theme="dark"] .copl-health-row {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07);
}
[data-theme="dark"] .copl-health-row:hover {
    background: rgba(99, 102, 241, .15);
    border-color: rgba(99, 102, 241, .35);
}
[data-theme="dark"] .copl-health-row.is-active {
    background: rgba(99, 102, 241, .18);
    border-color: rgba(99, 102, 241, .45);
}
[data-theme="dark"] .copl-health-row.is-complete {
    background: rgba(16, 185, 129, .12);
    border-color: rgba(16, 185, 129, .3);
}
[data-theme="dark"] .copl-health-row.is-complete .copl-health-icon { background: rgba(16, 185, 129, .2); color: #6ee7b7; }
[data-theme="dark"] .copl-health-icon { background: rgba(99, 102, 241, .2); color: #a5b4fc; }
[data-theme="dark"] .copl-health-label { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-health-bar { background: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .copl-health-num { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-health-num strong { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-health-percent { background: rgba(99, 102, 241, .18); color: #a5b4fc; }
[data-theme="dark"] .copl-health-row.is-complete .copl-health-percent { background: rgba(16, 185, 129, .2); color: #6ee7b7; }

[data-theme="dark"] .copl-distrib { background: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .copl-distrib-seg + .copl-distrib-seg { border-left-color: var(--dark-bg-surface); }

[data-theme="dark"] .copl-conn {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07);
}
[data-theme="dark"] .copl-conn-num { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-conn-lbl { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-conn--ehr > i    { background: rgba(245, 158, 11, .2);  color: #fbbf24; }
[data-theme="dark"] .copl-conn--sub > i    { background: rgba(124, 58, 237, .2);  color: #c4b5fd; }
[data-theme="dark"] .copl-conn--lead > i   { background: rgba(99, 102, 241, .2);  color: #a5b4fc; }
[data-theme="dark"] .copl-conn--assign > i { background: rgba(14, 165, 233, .2);  color: #7dd3fc; }

[data-theme="dark"] .copl-stuck-row {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07);
}
[data-theme="dark"] .copl-stuck-name { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-stuck-count { background: rgba(245, 158, 11, .2); color: #fbbf24; }

/* ── Advanced analytics row (density / specialty / geography) ── */
[data-theme="dark"] .copl-tile-denom {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .08);
    color: var(--dark-text-muted);
}
[data-theme="dark"] .copl-rank { border-top-color: rgba(255, 255, 255, .08); }
[data-theme="dark"] .copl-rank-title { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-rank-title i { color: #fbbf24; }
[data-theme="dark"] .copl-rank-sub { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-rank-row {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07);
}
[data-theme="dark"] .copl-rank-row:hover {
    background: rgba(99, 102, 241, .12);
    border-color: rgba(99, 102, 241, .35);
}
[data-theme="dark"] .copl-rank-pos { background: rgba(99, 102, 241, .2); color: #a5b4fc; }
[data-theme="dark"] .copl-rank-row:nth-child(1) .copl-rank-pos { background: rgba(245, 158, 11, .2); color: #fbbf24; }
[data-theme="dark"] .copl-rank-name-main { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-rank-name-sub { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-rank-name:hover .copl-rank-name-main { color: #a5b4fc; }
[data-theme="dark"] .copl-rank-bar { background: rgba(255, 255, 255, .08); }
[data-theme="dark"] .copl-rank-num { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-rank-num-sub { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-rank-share {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .08);
    color: var(--dark-text-muted);
}
[data-theme="dark"] .copl-rank-meta { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-rank-meta i { color: var(--dark-text-muted); }

[data-theme="dark"] .copl-specbar-row {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07);
}
[data-theme="dark"] .copl-specbar-row--other { background: rgba(255, 255, 255, 0.02); }
[data-theme="dark"] .copl-specbar-name { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-specbar-name i { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-specbar-bar { background: rgba(255, 255, 255, .08); }
[data-theme="dark"] .copl-specbar-num { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-specbar-pct {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .08);
    color: var(--dark-text-muted);
}

[data-theme="dark"] .copl-geo-summary { border-bottom-color: rgba(255, 255, 255, .08); }
[data-theme="dark"] .copl-geo-headline-lbl { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-geo-split-lbl { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-geo-split-num { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-geo-split-of { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-geo-cities-title { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-geo-city {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .08);
    color: var(--dark-text-primary);
}
[data-theme="dark"] .copl-geo-city:hover {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .15);
}
[data-theme="dark"] .copl-geo-city > i { color: #a5b4fc; }
[data-theme="dark"] .copl-geo-city-name { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-geo-city-count { background: rgba(99, 102, 241, .2); color: #a5b4fc; }

/* Toolbar additions */
[data-theme="dark"] .copl-sort-btn {
    background: rgba(255, 255, 255, 0.04);
    color: var(--dark-text-primary);
    border-color: rgba(255, 255, 255, 0.1);
}
[data-theme="dark"] .copl-sort-btn:hover {
    background: rgba(99, 102, 241, .15);
    color: #a5b4fc;
    border-color: rgba(99, 102, 241, .35);
}
[data-theme="dark"] .copl-sort-menu {
    background: var(--dark-bg-surface, #1a2027);
    border-color: rgba(255, 255, 255, 0.1);
}
[data-theme="dark"] .copl-sort-item { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-sort-item:hover,
[data-theme="dark"] .copl-sort-item.is-active { background: rgba(99, 102, 241, .15); color: #a5b4fc; }

[data-theme="dark"] .copl-density { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.07); }
[data-theme="dark"] .copl-density-btn { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-density-btn:hover { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-density-btn.is-active {
    background: rgba(255, 255, 255, 0.08);
    color: #a5b4fc;
    box-shadow: none;
}

/* Directory view-mode toggle — dark theme */
[data-theme="dark"] .cdir-view-btn {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .08);
    color: rgba(226, 232, 240, .72);
}
[data-theme="dark"] .cdir-view-btn:hover {
    background: rgba(165, 180, 252, .08);
    color: #c7d2fe;
}
[data-theme="dark"] .cdir-view-btn.is-active {
    background: rgba(99, 102, 241, .18);
    color: #c7d2fe;
    box-shadow: inset 0 0 0 1px rgba(165, 180, 252, .35);
}

[data-theme="dark"] .copl-toolbar-reset {
    background: rgba(255, 255, 255, 0.04);
    color: var(--dark-text-muted);
    border-color: rgba(255, 255, 255, 0.1);
}
[data-theme="dark"] .copl-toolbar-reset:hover {
    background: rgba(239, 68, 68, .15);
    color: #fca5a5;
    border-color: rgba(239, 68, 68, .4);
}

[data-theme="dark"] .copl-list-footer {
    background: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.07);
    color: var(--dark-text-muted);
}
[data-theme="dark"] .copl-list-footer strong { color: var(--dark-text-primary); }


/* Onboarding sectioned list — dark theme */
[data-theme="dark"] .copl-section { background: var(--dark-bg-surface, #1a2027); border-color: rgba(255, 255, 255, 0.06); }
[data-theme="dark"] .copl-section-head {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, var(--dark-bg-surface) 100%);
}
[data-theme="dark"] .copl-section-title { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-section-body { background: rgba(255, 255, 255, 0.02); }

[data-theme="dark"] .copl-page-list {
    background: var(--dark-bg-surface, #1a2027);
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .copl-page-btn { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-page-btn:hover { background: rgba(99, 102, 241, .15); color: #a5b4fc; }
[data-theme="dark"] .copl-page-info { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-page-info strong { color: var(--dark-text-primary); }


/* ════ Platform hub tabs (2027) — dark theme ════ */
[data-theme="dark"] .platform-hub-tabs {
    --copl-surface: var(--dark-bg-surface, #1a2027);
    --copl-surface-soft: rgba(255, 255, 255, 0.04);
    --copl-border: rgba(255, 255, 255, 0.07);
    --copl-border-strong: rgba(255, 255, 255, 0.12);
    --copl-text: var(--dark-text-primary, #e6ebf2);
    --copl-sub: var(--dark-text-muted, #94a3b8);
    --copl-muted: rgba(255, 255, 255, 0.45);
    --copl-accent-soft: rgba(99, 102, 241, 0.18);
    background: var(--dark-bg-surface, #1a2027);
    border-color: rgba(255, 255, 255, 0.07);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 18px 36px -28px rgba(0, 0, 0, .55);
}
[data-theme="dark"] .platform-hub-tab { color: var(--dark-text-muted); }
[data-theme="dark"] .platform-hub-tab:hover { background: rgba(255, 255, 255, 0.04); color: var(--dark-text-primary); }
[data-theme="dark"] .platform-hub-tab-icon { background: rgba(255, 255, 255, 0.05); color: var(--dark-text-muted); box-shadow: none; }
[data-theme="dark"] .platform-hub-tab:hover .platform-hub-tab-icon { background: rgba(99, 102, 241, 0.18); color: #a5b4fc; }
[data-theme="dark"] .platform-hub-tab-label { color: var(--dark-text-primary); }
[data-theme="dark"] .platform-hub-tab-sub { color: rgba(255, 255, 255, 0.45); }
[data-theme="dark"] .platform-hub-tab.is-active {
    background: rgba(99, 102, 241, 0.1);
    border-color: rgba(99, 102, 241, 0.4);
    box-shadow:
        inset 3px 0 0 0 #818cf8,
        0 10px 24px -16px rgba(0, 0, 0, .5);
}
[data-theme="dark"] .platform-hub-tab.is-active .platform-hub-tab-icon {
    background: rgba(99, 102, 241, 0.22);
    color: #a5b4fc;
    box-shadow: inset 0 0 0 1px rgba(165, 180, 252, 0.25);
}


/* ════ Clinic Portfolio 2027 refresh — dark theme ════ */
/* Override the inner top-highlight (white in light) with a soft cool glow. */
[data-theme="dark"] .copl-overview {
    box-shadow:
        0 1px 2px rgba(0, 0, 0, .4),
        0 24px 48px -32px rgba(0, 0, 0, .65);
}
[data-theme="dark"] .copl-overview::before {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .08), transparent);
}
[data-theme="dark"] .copl-overview-cta {
    background: rgba(99, 102, 241, .18);
    color: #a5b4fc;
}
[data-theme="dark"] .copl-overview-cta:hover {
    background: #6366f1;
    color: #fff;
    border-color: rgba(165, 180, 252, .35);
    box-shadow: 0 8px 20px -10px rgba(99, 102, 241, .6);
}
[data-theme="dark"] .copl-tile {
    background:
        linear-gradient(135deg, var(--copl-tile-tint, transparent), transparent 70%),
        rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .copl-tile--primary { --copl-tile-tint: rgba(99, 102, 241, .14); }
[data-theme="dark"] .copl-tile--success { --copl-tile-tint: rgba(16, 185, 129, .14); }
[data-theme="dark"] .copl-tile--warn    { --copl-tile-tint: rgba(245, 158, 11, .14); }
[data-theme="dark"] .copl-tile--accent  { --copl-tile-tint: rgba(124, 58, 237, .14); }
[data-theme="dark"] .copl-tile:hover {
    box-shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 14px 28px -18px rgba(0, 0, 0, .65);
    border-color: rgba(255, 255, 255, 0.12);
}
[data-theme="dark"] .copl-tile-icon { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .copl-tile-num { color: var(--dark-text-primary); }
[data-theme="dark"] .copl-tile-lbl { color: var(--dark-text-muted); }
[data-theme="dark"] .copl-overview-block {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02) 96%);
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
}
[data-theme="dark"] .copl-overview-block:hover {
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .25), 0 12px 28px -16px rgba(0, 0, 0, .55);
}
[data-theme="dark"] .copl-overview-block-head { border-bottom-color: rgba(255, 255, 255, 0.06); }
[data-theme="dark"] .copl-health-row,
[data-theme="dark"] a.copl-health-row {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.06);
    border-left-color: transparent;
    color: var(--dark-text-primary);
}
[data-theme="dark"] .copl-health-row:hover,
[data-theme="dark"] a.copl-health-row:hover {
    background: rgba(99, 102, 241, .14);
    border-color: rgba(99, 102, 241, .35);
    border-left-color: #818cf8;
    box-shadow: 0 6px 14px -10px rgba(0, 0, 0, .55);
}
