/* ============================================================
 * style-pro.css — Blue · White · Orange palette override
 * Loads AFTER style.css. Overrides V4/V4.3 indigo/violet theme.
 * ============================================================ */

/* ── CSS Variables ─────────────────────────────────────────── */
:root {
    /* Blue brand */
    --p1:  #1a5fff;   /* primary */
    --p2:  #0047d4;   /* primary darker */
    --p3:  #003aad;   /* primary darkest */
    --p-soft: rgba(26,95,255,.10);

    /* Orange accent */
    --a1:  #f97316;   /* accent */
    --a2:  #ea580c;   /* accent darker */
    --a-soft: rgba(249,115,22,.12);

    /* Surfaces */
    --bg:        #eef4ff;
    --surface:   #ffffff;
    --surface-2: #f0f5ff;
    --border:    #cddcf8;
    --border-2:  #dce8fb;
    --text:      #0b1a3d;
    --text-2:    #2a3d6a;
    --muted:     #6278a8;
    --muted-2:   #8fa3cc;

    /* Semantic */
    --success:  #10b981;
    --warning:  #f59e0b;
    --danger:   #ef4444;
    --info:     #06b6d4;

    /* Top nav — deep navy blue */
    --nav-bg:   linear-gradient(120deg, #04164a 0%, #082075 50%, #0b2b9a 100%);
    --nav-glow: 0 1px 0 rgba(255,255,255,.05) inset, 0 8px 32px rgba(4,22,74,.6);
    --nav-fg:   rgba(214,228,255,.82);
    --nav-fg-strong: #ffffff;

    --shadow-xs: 0 1px 1px rgba(11,26,61,.04);
    --shadow-sm: 0 1px 2px rgba(11,26,61,.05), 0 2px 4px rgba(11,26,61,.04);
    --shadow:    0 1px 3px rgba(11,26,61,.06), 0 8px 24px rgba(11,26,61,.07);
    --shadow-lg: 0 12px 36px rgba(11,26,61,.13), 0 4px 12px rgba(11,26,61,.06);
    --radius:    14px;
    --radius-sm: 10px;
}

/* ── Body canvas ───────────────────────────────────────────── */
body {
    background:
        radial-gradient(1200px 600px at 12% -10%, rgba(26,95,255,.06), transparent 55%),
        radial-gradient(900px 500px at 100% 0%, rgba(6,182,212,.04), transparent 60%),
        var(--bg) !important;
    color: var(--text);
}

/* ── TOP NAV ────────────────────────────────────────────────── */
.app-topnav {
    background: var(--nav-bg) !important;
    border-bottom: 1px solid rgba(255,255,255,.05) !important;
    box-shadow: var(--nav-glow) !important;
}

/* Remove old indigo/pink gradient line */
.app-topnav::before {
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(26,95,255,.55) 30%,
        rgba(249,115,22,.65) 65%,
        transparent 100%) !important;
}

/* Brand */
.app-topnav .topnav-brand .brand-mark {
    background: #fff !important;
    box-shadow: 0 4px 14px rgba(11,26,61,.22), inset 0 1px 0 rgba(255,255,255,.6) !important;
}
.app-topnav .topnav-brand .brand-name {
    background: linear-gradient(120deg, #fff 0%, #a5c4ff 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-weight: 700 !important;
}
.app-topnav .topnav-brand .brand-sub {
    color: rgba(165,196,255,.65) !important;
}
.app-topnav .topnav-brand {
    border-right-color: rgba(255,255,255,.08) !important;
}

/* Nav items */
@media (min-width: 993px) {
    .app-topnav .topnav-menu .topnav-item {
        color: var(--nav-fg) !important;
    }
    .app-topnav .topnav-menu .topnav-item:hover {
        background: rgba(255,255,255,.06) !important;
        color: #fff !important;
    }
    .app-topnav .topnav-menu .topnav-item:hover i.bi:not(.chev) {
        color: #7eb3ff !important;
        opacity: 1 !important;
    }
    .app-topnav .topnav-menu .topnav-item.active,
    .app-topnav .topnav-menu .topnav-item[aria-expanded="true"] {
        background: rgba(26,95,255,.16) !important;
        color: #fff !important;
    }
    .app-topnav .topnav-menu .topnav-item.active i.bi:not(.chev),
    .app-topnav .topnav-menu .topnav-item[aria-expanded="true"] i.bi:not(.chev) {
        color: #7eb3ff !important;
        opacity: 1 !important;
    }
    /* Orange underline for active */
    .app-topnav .topnav-menu .topnav-item.active::after {
        background: linear-gradient(90deg, var(--p1), var(--a1)) !important;
        box-shadow: 0 0 8px rgba(249,115,22,.5);
    }
}

/* Icon buttons */
.app-topnav .topnav-icon-btn {
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    color: rgba(214,228,255,.85) !important;
}
.app-topnav .topnav-icon-btn:hover {
    background: rgba(26,95,255,.18) !important;
    border-color: rgba(26,95,255,.45) !important;
    color: #fff !important;
}

/* User pill */
.app-topnav .topnav-user {
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    color: #fff !important;
}
.app-topnav .topnav-user:hover {
    background: rgba(26,95,255,.15) !important;
    border-color: rgba(26,95,255,.40) !important;
}
.app-topnav .topnav-user img {
    border: 1.5px solid rgba(26,95,255,.35) !important;
}
.app-topnav .topnav-user .user-mono {
    background: linear-gradient(135deg, var(--p1), var(--a1)) !important;
}

/* Mega-menu dropdown */
.app-topnav .topnav-dd-menu {
    background: rgba(6,14,52,.96) !important;
    border: 1px solid rgba(26,95,255,.25) !important;
    box-shadow: 0 24px 60px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.04) inset !important;
}
.app-topnav .topnav-dd-menu .topnav-dd-item {
    color: rgba(214,228,255,.88) !important;
}
.app-topnav .topnav-dd-menu .topnav-dd-item:hover {
    background: linear-gradient(90deg, rgba(26,95,255,.18), rgba(26,95,255,.08)) !important;
}
.app-topnav .topnav-dd-menu .topnav-dd-item .dd-icon {
    background: linear-gradient(135deg, rgba(26,95,255,.22), rgba(6,182,212,.16)) !important;
    color: #7eb3ff !important;
}
.app-topnav .topnav-dd-menu .topnav-dd-item:hover .dd-icon {
    background: linear-gradient(135deg, var(--p1), #38bdf8) !important;
    color: #fff !important;
}
.app-topnav .topnav-dd-menu .topnav-dd-item .dd-label { color: #fff !important; }
.app-topnav .topnav-dd-menu .topnav-dd-item .dd-sub { color: rgba(165,196,255,.65) !important; }
.app-topnav .topnav-dd-menu .topnav-dd-item.active {
    background: linear-gradient(90deg, rgba(26,95,255,.24), rgba(26,95,255,.12)) !important;
}
.app-topnav .topnav-dd-menu .topnav-dd-item.active .dd-icon {
    background: linear-gradient(135deg, var(--p1), var(--a1)) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(249,115,22,.35) !important;
}

/* User dropdown */
.app-topnav .topnav-user-menu {
    background: rgba(6,14,52,.96) !important;
    border: 1px solid rgba(26,95,255,.25) !important;
    box-shadow: 0 24px 60px rgba(0,0,0,.55) !important;
}
.app-topnav .topnav-user-menu .dropdown-item { color: rgba(214,228,255,.88) !important; }
.app-topnav .topnav-user-menu .dropdown-item:hover {
    background: rgba(26,95,255,.16) !important;
    color: #fff !important;
}
.app-topnav .topnav-user-menu .dropdown-item.text-danger { color: #fca5a5 !important; }
.app-topnav .topnav-user-menu .dropdown-item.text-danger:hover {
    background: rgba(239,68,68,.16) !important;
}
.app-topnav .topnav-user-menu .dropdown-divider { border-color: rgba(255,255,255,.08) !important; }

/* Mobile menu */
@media (max-width: 992px) {
    .topnav-menu {
        background: linear-gradient(180deg, #04164a, #062075) !important;
        border-bottom-color: rgba(255,255,255,.06) !important;
    }
    .topnav-menu > .topnav-item:hover {
        background: rgba(26,95,255,.14) !important;
        border-color: rgba(26,95,255,.35) !important;
    }
    .topnav-menu > .topnav-item.active {
        background: linear-gradient(135deg, rgba(26,95,255,.26), rgba(6,182,212,.16)) !important;
        border-color: rgba(26,95,255,.50) !important;
    }
    .topnav-menu > .topnav-item.active i.bi:not(.chev) {
        background: linear-gradient(135deg, var(--p1), var(--a1)) !important;
        color: #fff !important;
        box-shadow: 0 4px 12px rgba(26,95,255,.40) !important;
    }
    .topnav-menu .topnav-dd-item { background: rgba(255,255,255,.04) !important; border-color: rgba(255,255,255,.06) !important; }
    .topnav-menu .topnav-dd-item:hover { background: rgba(26,95,255,.12) !important; border-color: rgba(26,95,255,.32) !important; }
    .topnav-menu .topnav-dd-item.active {
        background: linear-gradient(135deg, rgba(26,95,255,.22), rgba(6,182,212,.14)) !important;
        border-color: rgba(26,95,255,.50) !important;
        box-shadow: 0 4px 18px rgba(26,95,255,.18) !important;
    }
    .topnav-menu .topnav-dd-item .dd-icon { background: linear-gradient(135deg, rgba(26,95,255,.18), rgba(6,182,212,.14)) !important; color: #7eb3ff !important; }
    .topnav-menu .topnav-dd-item.active .dd-icon { background: linear-gradient(135deg, var(--p1), var(--a1)) !important; color: #fff !important; }
    .topnav-menu .topnav-dd-item .dd-label { color: #fff !important; }
    .topnav-menu .topnav-dd-item .dd-sub { color: rgba(165,196,255,.70) !important; }
}

/* ── Page header ─────────────────────────────────────────── */
.page-topbar {
    background: transparent !important;
    border-bottom: none !important;
}
.page-title { color: var(--text) !important; font-weight: 800 !important; }
.page-title-icon {
    background: linear-gradient(135deg, rgba(26,95,255,.14), rgba(6,182,212,.10)) !important;
    color: var(--p1) !important;
    box-shadow: inset 0 0 0 1px rgba(26,95,255,.20), 0 6px 18px rgba(26,95,255,.10) !important;
}
.page-subtitle { color: var(--muted) !important; }

.page-breadcrumb a:hover { color: var(--p1) !important; }
.page-breadcrumb .current { color: var(--text) !important; }

/* ── Cards ───────────────────────────────────────────────── */
.card {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow-xs) !important;
}
.card:hover { box-shadow: var(--shadow-sm) !important; }
.card-header {
    background: var(--surface) !important;
    border-bottom: 1px solid var(--border-2) !important;
    padding: 14px 18px !important;
}
.card-header.bg-white { background: var(--surface) !important; }

/* ── Stat / KPI cards ────────────────────────────────────── */
.dashboard-stats .stat-card {
    border: 1px solid var(--border) !important;
    background: linear-gradient(180deg, #fff 0%, #f7faff 100%) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    position: relative !important;
}
/* Left accent bar: blue → orange → cyan → blue-dark per column */
.dashboard-stats .stat-card::before {
    content: '' !important;
    position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important;
    width: 3px !important;
    background: linear-gradient(180deg, var(--p1), var(--p2)) !important;
    opacity: 1 !important;
    border-radius: 0 !important;
}
.dashboard-stats > .col:nth-child(2) .stat-card::before { background: linear-gradient(180deg, var(--a1), var(--a2)) !important; }
.dashboard-stats > .col:nth-child(3) .stat-card::before { background: linear-gradient(180deg, var(--info), #0891b2) !important; }
.dashboard-stats > .col:nth-child(4) .stat-card::before { background: linear-gradient(180deg, var(--success), #047857) !important; }
.dashboard-stats > .col:nth-child(5) .stat-card::before { background: linear-gradient(180deg, var(--a1), var(--p1)) !important; }
.dashboard-stats .stat-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: var(--shadow) !important;
    border-color: rgba(26,95,255,.20) !important;
}
.dashboard-stats .stat-card .stat-value {
    color: var(--text) !important;
    font-size: 1.6rem !important;
    font-weight: 800 !important;
}
.dashboard-stats .stat-card small.text-muted {
    color: var(--muted) !important;
    font-size: 11px !important;
    letter-spacing: .08em !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}
/* Force numeric values to text color (not colored) */
.dashboard-stats .stat-card .text-success.stat-value,
.dashboard-stats .stat-card .text-danger.stat-value,
.dashboard-stats .stat-card .text-info.stat-value,
.dashboard-stats .stat-card .text-warning.stat-value { color: var(--text) !important; }

/* ── Tables ───────────────────────────────────────────────── */
.data-table-wrap {
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
}
.data-table-wrap th {
    background: linear-gradient(180deg, #f0f5ff, #e8f0fe) !important;
    color: var(--muted) !important;
    border-bottom: 1px solid var(--border) !important;
    font-weight: 700 !important;
    letter-spacing: .05em !important;
}
.th-sort.sort-asc .sort-icon .arrow-up,
.th-sort.sort-desc .sort-icon .arrow-down { color: var(--p1) !important; }
.data-table-wrap tbody tr:nth-child(even) td { background: rgba(240,245,255,.50) !important; }
.data-table-wrap tbody tr:hover td { background: rgba(26,95,255,.05) !important; }

/* Sticky first-col in light mode */
.table-sticky-first thead th:first-child { background: #e8f0fe !important; }
.table-sticky-first tbody td:first-child { background: var(--surface) !important; }

/* Horizontal scrollbar tinted blue */
.table-responsive::-webkit-scrollbar-track,
div[style*="overflow-x:auto"]::-webkit-scrollbar-track,
div[style*="overflow-x: auto"]::-webkit-scrollbar-track { background: #e8f0fe !important; }
.table-responsive::-webkit-scrollbar-thumb,
div[style*="overflow-x:auto"]::-webkit-scrollbar-thumb,
div[style*="overflow-x: auto"]::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--p1), var(--p2)) !important;
    border-color: #e8f0fe !important;
}
.table-responsive::-webkit-scrollbar-thumb:hover,
div[style*="overflow-x:auto"]::-webkit-scrollbar-thumb:hover,
div[style*="overflow-x: auto"]::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--a1), var(--p1)) !important;
}

/* ── Buttons ─────────────────────────────────────────────── */
.btn { font-weight: 600; border-radius: 10px; letter-spacing: .005em; }
.btn:active { transform: translateY(1px); }

.btn-primary {
    background: linear-gradient(135deg, var(--p1) 0%, var(--p2) 100%) !important;
    border: none !important;
    box-shadow: 0 2px 6px rgba(26,95,255,.28), 0 4px 14px rgba(26,95,255,.16) !important;
}
.btn-primary:hover, .btn-primary:focus {
    background: linear-gradient(135deg, var(--p2) 0%, var(--p3) 100%) !important;
    box-shadow: 0 4px 10px rgba(26,95,255,.35), 0 8px 22px rgba(26,95,255,.20) !important;
}

/* Orange accent button (use btn-warning for CTA) */
.btn-warning {
    background: linear-gradient(135deg, var(--a1) 0%, var(--a2) 100%) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(249,115,22,.28) !important;
}
.btn-warning:hover {
    background: linear-gradient(135deg, var(--a2) 0%, #c2410c 100%) !important;
    color: #fff !important;
}

.btn-success { background: linear-gradient(135deg, var(--success) 0%, #047857 100%) !important; border: none !important; }
.btn-danger  { background: linear-gradient(135deg, var(--danger) 0%, #b91c1c 100%) !important; border: none !important; }
.btn-outline-secondary {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-2) !important;
}
.btn-outline-secondary:hover {
    background: var(--surface-2) !important;
    border-color: #b0c8f0 !important;
    color: var(--text) !important;
}

/* ── Forms ───────────────────────────────────────────────── */
.form-control, .form-select {
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    background: var(--surface) !important;
    color: var(--text) !important;
}
.form-control:focus, .form-select:focus {
    border-color: var(--p1) !important;
    box-shadow: 0 0 0 3px rgba(26,95,255,.13) !important;
    background: #fff !important;
}
.form-label { color: var(--text-2) !important; }
.input-group-text {
    background: var(--surface-2) !important;
    border-color: var(--border) !important;
    color: var(--muted) !important;
}

/* ── Pagination ──────────────────────────────────────────── */
.data-pagination .page-link {
    border-color: var(--border) !important;
    color: var(--text-2) !important;
    background: var(--surface) !important;
    border-radius: 8px !important;
}
.data-pagination .page-link:hover {
    background: var(--surface-2) !important;
    border-color: #b0c8f0 !important;
    color: var(--p1) !important;
}
.data-pagination .page-item.active .page-link {
    background: var(--p1) !important;
    border-color: var(--p1) !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(26,95,255,.35) !important;
}

/* ── Tabs ────────────────────────────────────────────────── */
.data-tabs .nav-link { color: var(--muted) !important; font-weight: 600 !important; }
.data-tabs .nav-link:hover { color: var(--p1) !important; border-bottom-color: #a5c4ff !important; }
.data-tabs .nav-link.active {
    color: var(--p1) !important;
    border-bottom-color: var(--p1) !important;
}
.nav-tabs { border-bottom-color: var(--border-2) !important; }

/* ── Login screen ─────────────────────────────────────────── */
.login-container {
    background:
        radial-gradient(1000px 600px at 75% -5%, rgba(99,102,241,.28), transparent 60%),
        radial-gradient(700px 500px at -5% 95%, rgba(139,92,246,.20), transparent 60%),
        linear-gradient(135deg, #07092b 0%, #0e1650 45%, #151e6e 100%) !important;
}
.login-container::before {
    background-image:
        linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px) !important;
}
.login-card {
    border-radius: 22px !important;
    box-shadow: 0 30px 80px -20px rgba(0,0,0,.60), 0 0 0 1px rgba(255,255,255,.07) !important;
}
.login-card h3 {
    background: linear-gradient(135deg, #0b1a3d, var(--p1) 80%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}
.login-card .btn-primary {
    background: linear-gradient(135deg, var(--p1) 0%, var(--p2) 100%) !important;
    box-shadow: 0 4px 16px rgba(26,95,255,.38) !important;
}
.login-card .btn-primary:hover {
    background: linear-gradient(135deg, var(--p2) 0%, var(--p3) 100%) !important;
    box-shadow: 0 6px 22px rgba(26,95,255,.48) !important;
}

/* ── Topbar icon btn + user (outside nav – page body) ──────── */
.topbar-icon-btn:hover { color: var(--p1) !important; border-color: #b0c8f0 !important; }
.topbar-user:hover { border-color: #b0c8f0 !important; }
.topbar-user-avatar {
    background: linear-gradient(135deg, var(--p1), var(--a1)) !important;
}

/* ── Scrollbar (global) ──────────────────────────────────── */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb {
    background: #b5caf5;
    border-radius: 8px;
    border: 2px solid var(--bg);
}
::-webkit-scrollbar-thumb:hover { background: var(--p1); }

/* ── Misc ────────────────────────────────────────────────── */
.alert { border-radius: 12px !important; }
.alert-danger { border-color: rgba(239,68,68,.18) !important; }
.badge.bg-warning { color: #78350f !important; }
.modal-content { border-radius: var(--radius) !important; }
.sidebar-link.active::before { background: var(--p1) !important; box-shadow: 0 0 12px rgba(26,95,255,.55) !important; }
.sidebar-link.active i { color: #7eb3ff !important; }
.sidebar-brand-icon { background: linear-gradient(135deg, var(--p1), var(--a1)) !important; box-shadow: 0 6px 18px rgba(26,95,255,.40) !important; }

/* Filter card */
.page-body > .card.shadow-sm.mb-3:first-child {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
}

/* Page title icon on pages */
.page-title-icon { background: linear-gradient(135deg, rgba(26,95,255,.13), rgba(6,182,212,.09)) !important; }

/* ── DARK MODE ───────────────────────────────────────────── */
.dark-mode {
    --bg:        #050e28;
    --surface:   #0d1a3f;
    --surface-2: #14255a;
    --border:    #1e3168;
    --border-2:  #192a5a;
    --text:      #e4ecff;
    --text-2:    #b8caf5;
    --muted:     #7a96cc;
    --muted-2:   #5571a8;
}
.dark-mode body {
    background:
        radial-gradient(1200px 600px at 12% -10%, rgba(26,95,255,.12), transparent 55%),
        radial-gradient(900px 500px at 100% 0%, rgba(6,182,212,.06), transparent 60%),
        var(--bg) !important;
    color: var(--text) !important;
}
.dark-mode .card,
.dark-mode .data-table-wrap,
.dark-mode .table-container,
.dark-mode .dashboard-stats .stat-card {
    background: var(--surface) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}
.dark-mode .dashboard-stats .stat-card {
    background: linear-gradient(180deg, var(--surface), var(--surface-2)) !important;
}
.dark-mode .card-header,
.dark-mode .card-header.bg-white {
    background: var(--surface) !important;
    border-color: var(--border-2) !important;
}
.dark-mode .data-table-wrap th {
    background: linear-gradient(180deg, #081530, #0a1a3c) !important;
    color: var(--muted) !important;
    border-bottom-color: var(--border) !important;
}
.dark-mode .data-table-wrap tbody tr:nth-child(even) td { background: rgba(8,21,48,.45) !important; }
.dark-mode .data-table-wrap tbody tr:hover td { background: rgba(26,95,255,.12) !important; }
.dark-mode .data-table-wrap td { color: var(--text) !important; border-color: var(--border-2) !important; }
.dark-mode .form-control,
.dark-mode .form-select,
.dark-mode input,
.dark-mode select,
.dark-mode textarea {
    background: #060f2a !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}
.dark-mode .form-control::placeholder { color: var(--muted-2) !important; }
.dark-mode .input-group-text { background: var(--surface-2) !important; border-color: var(--border) !important; color: var(--text-2) !important; }
.dark-mode .btn-outline-secondary {
    background: var(--surface) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}
.dark-mode .btn-outline-secondary:hover { background: var(--surface-2) !important; color: var(--text) !important; }
.dark-mode .page-link { background: var(--surface) !important; border-color: var(--border) !important; color: var(--text-2) !important; }
.dark-mode .page-link:hover { background: var(--surface-2) !important; }
.dark-mode .page-item.active .page-link { background: var(--p1) !important; border-color: var(--p1) !important; color: #fff !important; }
.dark-mode .modal-content,
.dark-mode .dropdown-menu { background: var(--surface) !important; border-color: var(--border) !important; color: var(--text) !important; }
.dark-mode .modal-header,
.dark-mode .modal-footer { border-color: var(--border) !important; }
.dark-mode .dropdown-item { color: var(--text) !important; }
.dark-mode .dropdown-item:hover { background: var(--surface-2) !important; }
.dark-mode .table > :not(caption) > * > * { color: var(--text) !important; background-color: transparent !important; border-color: var(--border) !important; }
.dark-mode .table > thead th,
.dark-mode .table > thead td { background: var(--surface-2) !important; color: var(--muted) !important; border-color: var(--border) !important; }
.dark-mode .table-hover > tbody > tr:hover > * { background: rgba(26,95,255,.15) !important; color: var(--text) !important; }
.dark-mode .tag-input-wrapper { background: #060f2a !important; border-color: var(--border) !important; }
.dark-mode .tag-chip { background: #0e214e !important; color: #7eb3ff !important; border-color: #1e3a7e !important; }
.dark-mode .tag-rm { color: #7eb3ff !important; }
.dark-mode .tag-dropdown { background: var(--surface) !important; border-color: var(--border) !important; }
.dark-mode .tag-drop-item { color: var(--text) !important; }
.dark-mode .tag-drop-item:hover { background: #0e214e !important; }
.dark-mode h1, .dark-mode h2, .dark-mode h3, .dark-mode h4, .dark-mode h5, .dark-mode h6 { color: var(--text) !important; }
.dark-mode .text-muted { color: var(--muted) !important; }
.dark-mode .alert-success { background: rgba(16,185,129,.10) !important; color: #6ee7b7 !important; }
.dark-mode .alert-danger  { background: rgba(239,68,68,.10) !important;  color: #fca5a5 !important; }
.dark-mode .alert-warning { background: rgba(249,115,22,.12) !important; color: #fcd34d !important; }
.dark-mode .alert-info    { background: rgba(6,182,212,.12) !important;  color: #7dd3fc !important; }
.dark-mode .table-responsive::-webkit-scrollbar-track,
.dark-mode div[style*="overflow-x:auto"]::-webkit-scrollbar-track { background: #060f2a !important; }
.dark-mode .table-responsive::-webkit-scrollbar-thumb,
.dark-mode div[style*="overflow-x:auto"]::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--p1), var(--p2)) !important; border-color: #060f2a !important; }
.dark-mode .table-sticky-first thead th:first-child { background: #0a1a3c !important; }
.dark-mode .table-sticky-first tbody td:first-child { background: var(--surface) !important; }
.dark-mode ::-webkit-scrollbar-track { background: var(--bg) !important; }
.dark-mode ::-webkit-scrollbar-thumb { background: #1e3168 !important; border-color: var(--bg) !important; }
.dark-mode ::-webkit-scrollbar-thumb:hover { background: var(--p1) !important; }
.dark-mode .login-container {
    background:
        radial-gradient(1200px 700px at 80% -10%, rgba(26,95,255,.22), transparent 60%),
        radial-gradient(900px 600px at -10% 100%, rgba(6,182,212,.12), transparent 60%),
        linear-gradient(135deg, #010818 0%, #020e30 50%, #010818 100%) !important;
}
.dark-mode .login-card { background: var(--surface) !important; }
.dark-mode .login-card h3 { background: linear-gradient(135deg, #e4ecff, #7eb3ff 80%) !important; }
.dark-mode .login-card .form-control { background: #060f2a !important; border-color: var(--border) !important; color: var(--text) !important; }
.dark-mode .login-card .input-group-text { background: #060f2a !important; border-color: var(--border) !important; color: var(--muted) !important; }