/* ============================================================
   themes/light.css — "white mode": clean neutral light theme.

   To activate: point the theme <link> in app/templates/base.html
   at /static/css/themes/light.css instead of /static/css/theme.css.
   Identical token contract to theme.css (65 tokens).

   Design notes (light is not an inversion — values are retuned):
   - Elevation flips direction: the page is soft gray and raised
     surfaces get WHITER (cards are #ffffff floating on #eaedf2),
     with LAYERED shadows doing the lifting.
   - Ink flips to black: borders, dividers and neutral hovers are
     low-opacity black washes via --ink-rgb.
   - Accents go deeper/darker than the dark theme's pastels so
     text and icons hold WCAG AA on white; the translucent badge
     washes become soft tints automatically via the -rgb triplets.
   - No pure black text: #1f2328 primary on white (~15:1), calmer
     over long sessions, same principle as the dark theme.

   Retuned for stronger card separation (v2): the page background
   was deepened and cooled, borders nudged up, and the three
   shadow tokens rebuilt as two-layer shadows so cards read as
   distinctly raised instead of floating on near-white. Nothing
   else — including the AA-tuned accents — was changed.
   ============================================================ */
:root {
    /* ---- Ink & shadow bases: black ink on a light field */
    --ink-rgb: 0,0,0;
    --shadow-rgb: 17,17,18;

    /* ---- Accents — deepened for contrast on white. Hex + rgb pairs. */
    --primary: #16749e;            --primary-rgb: 22,116,158;
    --primary-dark: #125e81;       --primary-dark-rgb: 18,94,129;
    --primary-bright: #4aa3cf;     --primary-bright-rgb: 74,163,207;  /* chart line/gradient tint */
    --accent-indigo: #5a63c4;      --accent-indigo-rgb: 90,99,196;
    --accent-green: #1a7f4b;       --accent-green-rgb: 26,127,75;
    --accent-teal: #0f766e;        --accent-teal-rgb: 15,118,110;
    --accent-orange: #b5581b;      --accent-orange-rgb: 181,88,27;
    --accent-orange-dark: #a85512; --accent-orange-dark-rgb: 168,85,18;
    --accent-red: #c04949;         --accent-red-rgb: 192,73,73;
    --accent-red-bright: #a13535;    /* error text on red washes (dark in light mode) */
    --accent-yellow: #8a7009;      --accent-yellow-rgb: 138,112,9;
    --accent-pink: #bd5285;       --accent-pink-rgb: 189,82,133;
    --accent-violet: #7a63c2;      --accent-violet-rgb: 122,99,194;

    /* Common derived washes — soft tints on white */
    --primary-light: rgba(var(--primary-rgb),0.12);
    --accent-orange-light: rgba(var(--accent-orange-rgb),0.12);

    /* ---- Primary action buttons — blue on the --primary ramp with white
       text (contrast > 4.5:1), matching the dark theme's treatment;
       links/nav stay on --primary. */
    --btn-primary-bg: var(--primary);
    --btn-primary-bg-2: var(--primary-dark);
    --btn-primary-hover-2: #0e4c68;
    --btn-primary-text: #ffffff;

    /* ---- Elevation layers — page is soft gray, raised surfaces whiter.
       Page deepened from #f4f5f7 so #ffffff cards clearly separate.
       v3: the whole gray ramp de-blued — the earlier cool-cast grays
       (#eaedf2 etc.) read as a bluish hue over the page; grays are
       now neutral (equal-ish RGB) at the same lightness. */
    --bg-body: #fafafa;              /* base background (page) — near-white; borders carry card separation */
    --bg-card: #ffffff;              /* panels, cards, sidebar, header, table body */
    --bg-inner: #f6f6f7;             /* subtle inset (table headers, bars, inner sections) */
    --bg-card-hover: #f0f0f1;        /* interactive: row hover, selected, chips */
    --bg-input: #ffffff;             /* inputs: white wells with token borders */
    --bg-raised-hover: #e3e3e5;      /* hover on raised surfaces (buttons) */
    --bg-console: #e9e9ea;           /* terminal/log output wells — inset below base */
    --bg-sidebar: #ffffff;
    --bg-sidebar-hover: rgba(var(--ink-rgb),0.04);
    --bg-sidebar-active: rgba(var(--primary-rgb),0.10);

    /* ---- Text — near-black, never #000; AA+ on their layers */
    --text-primary: #1f2328;
    --text-secondary: #454c54;
    --text-muted: #636c76;       --text-muted-rgb: 99,108,118;
    --text-sidebar: #454c54;
    --text-sidebar-hover: #1f2328;
    --text-on-accent: #ffffff;       /* icon/initials on solid accent chips */
    --text-on-primary: #ffffff;      /* text on solid --primary fills (pagination active) */
    --text-bright: #111418;          /* stat numerals — strongest text in light mode */

    /* ---- Borders — low-opacity ink, nudged up so card edges register */
    --border-color: rgba(var(--ink-rgb),0.12);
    --border-color-hover: rgba(var(--ink-rgb),0.22);
    --border-radius: 14px;
    --border-radius-sm: 8px;

    /* ---- Shadows & overlays — two-layer so cards read as raised
       (a tight contact shadow + a soft ambient one). */
    --shadow-sm: 0 1px 2px rgba(var(--shadow-rgb),0.06), 0 1px 3px rgba(var(--shadow-rgb),0.10);
    --shadow-md: 0 2px 4px rgba(var(--shadow-rgb),0.06), 0 6px 16px rgba(var(--shadow-rgb),0.12);
    --shadow-lg: 0 4px 8px rgba(var(--shadow-rgb),0.08), 0 14px 32px rgba(var(--shadow-rgb),0.16);
    --stat-value-shadow: none;               /* dark halo behind dark text just looks muddy */
    /* Panels get a whisper of lift — the 40%-black dark-theme shadow is far
       too heavy on a light page; borders do most of the separation here. */
    --panel-shadow: 0 1px 2px rgba(var(--shadow-rgb),0.04), 0 4px 12px rgba(var(--shadow-rgb),0.06);
    --panel-shadow-hover: 0 2px 4px rgba(var(--shadow-rgb),0.05), 0 8px 20px rgba(var(--shadow-rgb),0.09);

    /* ---- Chart categorical series — vivid mid-lightness fills for white
       surfaces (the muted text accents above look washed out as chart fills).
       Fixed order, CVD-validated; revalidate if you change these. */
    --chart-cat-1: #2a78d6;  --chart-cat-2: #eb6834;
    --chart-cat-3: #1baf7a;  --chart-cat-4: #eda100;
    --chart-cat-5: #e87ba4;  --chart-cat-6: #008300;
    --chart-cat-7: #4a3aa7;  --chart-cat-8: #e34948;
    --chart-tooltip-bg: rgba(255,255,255,0.98);
    --chart-tooltip-border: rgba(0,0,0,0.12);

    /* ---- Layout / misc (not colors, kept with the theme) */
    --sidebar-width: 220px;
    --sidebar-collapsed-width: 52px;
    --sidebar-bg: #ffffff;
    --transition: all 0.15s ease;
    --font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono: 'Space Mono', 'SF Mono', 'Consolas', monospace;
}

/* ---- Sidebar: slate-dark even in light mode ----
   Values mirror themes/slate.css. Custom properties resolve at the use
   site, so re-declaring them scoped to .sidebar restyles everything the
   sidebar's children read — including generic tokens (--text-primary,
   --primary, --border-color…) that would otherwise paint dark-on-dark.
   The user pop-out menu lives outside the sidebar element and gets its
   own matching block below. */
.sidebar {
    --sidebar-bg: #0d1220;
    --bg-card: #0f172a;                      /* submenu flyout panels */
    --bg-sidebar-hover: rgba(255,255,255,0.04);
    --bg-sidebar-active: rgba(56,189,248,0.12);
    --text-sidebar: #cbd5e1;
    --text-sidebar-hover: #ffffff;

    --ink-rgb: 255,255,255;                  /* hover edge, subtle washes */
    --text-primary: #f8fafc;                 /* brand text, user name */
    --text-muted: #94a3b8;                   /* section labels, pin, role, chevron */
    --primary: #38bdf8; --primary-rgb: 56,189,248;   /* active link, pin */
    --border-color: rgba(255,255,255,0.06);
    --border-color-hover: rgba(255,255,255,0.12);
    --bg-card-hover: #131c33;                /* user-menu trigger open state */
}

/* The user pop-out menu is fixed-positioned outside the sidebar element,
   so the .sidebar scope can't reach it — same slate treatment here. */
.user-menu {
    --bg-card: #0f172a;
    --bg-card-hover: #131c33;
    --border-color: rgba(255,255,255,0.06);
    --border-color-hover: rgba(255,255,255,0.12);
    --text-primary: #f8fafc;                 /* name */
    --text-secondary: #cbd5e1;               /* menu items */
    --text-muted: #94a3b8;                   /* role line */
    --primary: #38bdf8; --primary-rgb: 56,189,248;   /* avatar gradient */
    --accent-indigo: #818cf8;
    --accent-red: #f87171; --accent-red-rgb: 248,113,113;  /* sign-out */
}