/* ContextGrade — Dark theme variables and overrides */

[data-theme='dark'] {
    --bg-color: #0f172a;
    --sidebar-bg: rgba(30, 41, 59, 0.8);
    --glass-bg: rgba(255, 255, 255, 0.05);
    --glass-border: rgba(255, 255, 255, 0.1);
    --accent-primary: #34d399;
    --accent-secondary: #93c5fd;
    --text-main: #f8fafc;
    --text-muted: #94a3b8;
    --table-container-bg: rgba(15, 23, 42, 0.1);
}

[data-theme='dark'] body {
    background-image:
        radial-gradient(at 0% 0%, rgba(16, 185, 129, 0.1) 0px, transparent 50%),
        radial-gradient(at 100% 100%, rgba(26, 54, 93, 0.2) 0px, transparent 50%);
}

[data-theme='dark'] .Select.is-disabled .Select-control {
    background: rgba(255, 255, 255, 0.02) !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

/* Button dark mode overrides — replace light accent gradient with readable alternatives */
[data-theme='dark'] .btn-primary                { background: #059669; }
[data-theme='dark'] .btn-primary:hover          { background: #047857; }
[data-theme='dark'] .btn-premium                { background: linear-gradient(135deg, #059669, #1A365D); }
[data-theme='dark'] .btn-premium:hover          { background: linear-gradient(135deg, #047857, #152a47); }

/* Table dark mode — override Bootstrap's white --bs-table-bg */
[data-theme='dark'] .table-dark-custom tbody td {
    --bs-table-bg: transparent;
    background-color: rgba(30, 41, 59, 0.5) !important;
}

[data-theme='dark'] .table-dark-custom thead th {
    --bs-table-bg: transparent;
    background-color: rgba(15, 23, 42, 0.7) !important;
}

[data-theme='dark'] .table-dark-custom tbody tr:hover td {
    background-color: rgba(51, 65, 85, 0.6) !important;
}

/* Badge dark mode overrides */
[data-theme='dark'] .badge-free   { background: rgba(52, 211, 153, 0.15);  color: #34d399; }
[data-theme='dark'] .badge-plus   { background: rgba(147, 197, 253, 0.15); color: #93c5fd; }
[data-theme='dark'] .badge-pro    { background: #1e3a5f;                    color: #ffffff; }
[data-theme='dark'] .badge-warn   { background: rgba(251, 191, 36, 0.15);  color: #fbbf24; }
[data-theme='dark'] .badge-danger { background: rgba(248, 113, 113, 0.15); color: #f87171; }