/* ContextGrade — Light theme variables and overrides */

:root {
    --bg-color: #f1f5f9;
    --sidebar-bg: rgba(255, 255, 255, 0.8);
    --glass-bg: rgba(0, 0, 0, 0.03);
    --glass-border: rgba(0, 0, 0, 0.1);
    --accent-primary: #10B981;
    --accent-secondary: #1A365D;
    --text-main: #1e293b;
    --text-muted: #64748b;
    --table-container-bg: rgba(255, 255, 255, 0.6);
    --sidebar-width: 236px;
    --sidebar-collapsed-width: 60px;
    --header-height: 38px;
    --footer-height: 64px;
    --transition-speed: 0.3s;
    /* Modal system (DS-04, assets/17_modals.css): an opaque window surface,
       the danger family the confirm shape and the inline confirm strip use,
       the two scrims (full for dialogs, light for side sheets so the page
       stays readable beside them) and the window shadow. */
    --surface: #ffffff;
    --danger: #b91c1c;
    --danger-solid: #dc2626;
    --danger-soft: #fdf0f0;
    --danger-line: #f3c9c9;
    --scrim: rgba(15, 23, 42, 0.42);
    --scrim-light: rgba(15, 23, 42, 0.10);
    --shadow-modal: 0 24px 48px -16px rgba(15, 23, 42, 0.35), 0 2px 6px rgba(15, 23, 42, 0.08);
}

[data-theme='light'] .results-summary-divider {
    border-right: 2px solid rgba(0, 0, 0, 0.15) !important;
}

/* Item 6: the gridline hierarchy inverts on light (dark lines on a pale panel).
   Kept deliberately soft - these are separators, not rules; the weight carries
   the hierarchy, not the darkness. */
[data-theme='light'] {
    --gb-gridline: rgba(0, 0, 0, 0.07);
    --gb-part-divider: rgba(0, 0, 0, 0.14);
    --gb-band-divider: rgba(0, 0, 0, 0.22);
}

[data-theme='light'] .nav-separator {
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

[data-theme='light'] .table-dark-custom thead th {
    background-color: rgba(0, 0, 0, 0.04) !important;
}

[data-theme='light'] .table-dark-custom tbody td {
    background-color: transparent !important;
}

[data-theme='light'] .table-dark-custom tbody tr:hover td {
    background-color: rgba(0, 0, 0, 0.04) !important;
}

/* Status badge parity for light theme (dark theme defines these in theme-dark.css) */
[data-theme='light'] .badge-warn    { background: rgba(217, 119, 6, 0.12);  color: #b45309; }
[data-theme='light'] .badge-danger  { background: rgba(220, 38, 38, 0.10);  color: #b91c1c; }
[data-theme='light'] .badge-success { background: rgba(5, 150, 105, 0.12);  color: #047857; }
[data-theme='light'] .badge-info    { background: rgba(37, 99, 235, 0.10);  color: #1d4ed8; }