/* ============================================================
   LendingWise Design System — runtime tokens (GENERATED — DO NOT EDIT)
   Built by scripts/design-system/build-lw-tokens.sh from .claude/skills/lw-design/tokens/
   Sources, in order: colors.css typography.css spacing.css charts.css
   Light = :root · Dark = body.dark-mode (production class, see dark-mode.css)
   Custom properties only: color-scheme declarations and app-owned names are removed at build time.
   Consume with var(--lw-*). Never add hex values next to a token.
   ============================================================ */


/* ---- source: tokens/colors.css ---- */
/* ============================================================
   LendingWise — Color Tokens (light + dark)
   THEME MECHANISM: light is the default on bare :root; dark is keyed to
   body.dark-mode (the production body class, server-rendered from the
   darkMode cookie + per-user DB column). Every colour token is declared
   in BOTH blocks. color-scheme is declared in both so native scrollbars,
   date pickers, <select> option lists and spinners follow the theme.

   .lw-dark-scope is an ALIAS used only by specimen cards so one document
   can render both themes side by side. Production uses body.dark-mode.

   RULE OF THE SYSTEM: status colour lives on SMALL elements only — pills,
   3px left-border accents, dots, icons — NEVER a full-cell/row flood.
   That rule matters more in dark, where a saturated flood is painful.

   §2 LIGHT CORRECTIONS (measured AA fixes; hue/sat held, lightness moved):
     --lw-text-muted      #7E8299 → #6B7088   (4.50 on #F3F6F9)
     --lw-primary         #3699FF → #3196FF   (3.03 non-text vs page)
     --lw-primary-ink     NEW     #0069D6     (5.26 on #FFF)
     --lw-success-fill    #1BC5BD → #12847F   (white label 4.53)
     --lw-danger-fill     #F64E60 → #D0071E   (white label 5.63)
     --lw-success-ink     #0d9488 → #117974   (4.51 on tint)
     --lw-warning-ink     #b8790a → #9A6600   (4.50 on tint)
     --lw-danger-ink      NEW     #D20B20     (4.53 on tint)
     --lw-info-ink        NEW     #7A3AFC     (4.50 on tint)
     --lw-neutral-ink     NEW     #5A5F73     (5.55 on tint)
     --lw-input-border    NEW     #838DB6     (3.00 on #F3F6F9)
   Decorative borders (--lw-border, -light, -strong), placeholder and
   disabled greys are unchanged (exempt / not held to 3:1).
   ============================================================ */

:root {

  /* ---- Brand / Primary (two roles, used strictly) ---------- */
  --lw-primary:            #3196FF;  /* FILL: buttons, active nav, marks, borders (≥3:1 non-text) */
  --lw-primary-ink:        #0069D6;  /* INK: links, text, icons beside text (≥4.5:1) */
  --lw-primary-hover:      #1086FF;
  --lw-primary-active:     #037FFF;
  --lw-primary-light:      #E1F0FF;  /* tint */
  --lw-primary-tint:       #E1F0FF;
  --lw-link:               #0069D6;
  --lw-link-hover:         #0057B3;
  --lw-text-on-primary:    #FFFFFF;

  /* ---- Neutrals / Text ------------------------------------- */
  --lw-dark:               #181C32;  /* headings — inverts to lightest ink in dark */
  --lw-text-primary:       #181C32;
  --lw-text:               #3F4254;  /* body */
  --lw-text-secondary:     #3F4254;
  --lw-text-muted:         #6B7088;
  --lw-text-placeholder:   #B5B5C3;  /* exempt (1.4.3) */
  --lw-text-inverse:       #F2F4FB;

  /* ---- Surfaces (four-step ladder) ------------------------- */
  --lw-white:              #FFFFFF;
  --lw-bg:                 #F3F6F9;  /* canvas */
  --lw-surface:            #FFFFFF;  /* cards, modals, table bodies */
  --lw-surface-raised:     #FFFFFF;  /* dropdowns, popovers, menus */
  --lw-surface-sunken:     #F3F6F9;  /* input wells, code, document frames */
  --lw-surface-alt:        #F3F6F9;  /* zebra, read-only */
  --lw-surface-hover:      #F2F2F2;

  /* ---- Borders (decorative — NOT held to 3:1) -------------- */
  --lw-border:             #E4E6EF;
  --lw-border-light:       #EBEDF3;
  --lw-border-strong:      #D1D3E0;

  /* ---- Status triple: fill / on-fill / tint / ink ---------- */
  --lw-status-pending:        #FFA800;   /* alias = fill */
  --lw-status-pending-fill:   #FFA800;
  --lw-text-on-warning:       #231703;   /* 9.08 on amber (settled) */
  --lw-status-pending-soft:   #FFF4DE;
  --lw-status-pending-tint:   #FFF4DE;
  --lw-status-pending-ink:    #9A6600;

  --lw-status-pass:           #12847F;   /* fill (teal, darkened for white label) */
  --lw-status-pass-fill:      #12847F;
  --lw-text-on-success:       #FFFFFF;
  --lw-status-pass-soft:      #C9F7F5;
  --lw-status-pass-tint:      #C9F7F5;
  --lw-status-pass-ink:       #117974;

  --lw-status-fail:           #D0071E;
  --lw-status-fail-fill:      #D0071E;
  --lw-text-on-danger:        #FFFFFF;
  --lw-status-fail-soft:      #FFE2E5;
  --lw-status-fail-tint:      #FFE2E5;
  --lw-status-fail-ink:       #D20B20;

  --lw-status-disabled:       #B5B5C3;   /* exempt */
  --lw-status-disabled-fill:  #B5B5C3;
  --lw-text-on-disabled:      #181C32;
  --lw-status-disabled-soft:  #EEF0F5;
  --lw-status-disabled-tint:  #EEF0F5;
  --lw-status-disabled-ink:   #5A5F73;

  /* ---- Extended semantic (buttons, alerts, labels) --------- */
  --lw-success:            #12847F;
  --lw-success-fill:       #12847F;
  --lw-success-hover:      #0E6B67;
  --lw-success-light:      #C9F7F5;
  --lw-success-tint:       #C9F7F5;
  --lw-success-ink:        #117974;
  --lw-warning:            #FFA800;
  --lw-warning-fill:       #FFA800;
  --lw-warning-light:      #FFF4DE;
  --lw-warning-tint:       #FFF4DE;
  --lw-warning-ink:        #9A6600;
  --lw-danger:             #D0071E;
  --lw-danger-fill:        #D0071E;
  --lw-danger-hover:       #AD0619;
  --lw-danger-light:       #FFE2E5;
  --lw-danger-tint:        #FFE2E5;
  --lw-danger-ink:         #D20B20;
  --lw-info:               #8950FC;
  --lw-info-fill:          #7A3AFC;
  --lw-text-on-info:       #FFFFFF;
  --lw-info-light:         #EEE5FF;
  --lw-info-tint:          #EEE5FF;
  --lw-info-ink:           #7A3AFC;
  --lw-neutral-tint:       #EEF0F5;
  --lw-neutral-ink:        #5A5F73;
  --lw-neutral-fill:       #6B7088;
  --lw-text-on-neutral:    #FFFFFF;

  /* ---- Secondary / light button ---------------------------- */
  --lw-btn-secondary-bg:       #E4E6EF;
  --lw-btn-secondary-bg-hover: #CCD0E1;
  --lw-btn-secondary-fg:       #181C32;
  --lw-btn-secondary-border:   #E4E6EF;
  --lw-btn-light-bg:           #F3F6F9;
  --lw-btn-light-bg-hover:     #E4E6EF;
  --lw-btn-light-fg:           #3F4254;
  --lw-btn-light-border:       transparent;

  /* ---- Form controls --------------------------------------- */
  --lw-input-bg:            #FFFFFF;
  --lw-input-bg-hover:      #FFFFFF;
  --lw-input-bg-disabled:   #F3F6F9;
  --lw-input-bg-readonly:   #F3F6F9;
  --lw-input-border:        #838DB6;
  --lw-input-border-hover:  #6B7088;
  --lw-input-border-focus:  #3196FF;
  --lw-input-border-error:  #D0071E;
  --lw-input-fg:            #3F4254;
  --lw-input-placeholder:   #B5B5C3;
  --lw-input-fg-disabled:   #B5B5C3;
  --lw-switch-off-track:    #838DB6;
  --lw-switch-knob:         #FFFFFF;

  /* ---- Table ----------------------------------------------- */
  --lw-table-header-bg:     #F3F6F9;
  --lw-table-header-fg:     #6B7088;
  --lw-table-row-alt:       #F3F6F9;
  --lw-table-row-hover:     #F2F2F2;

  /* ---- Focus (two-tone ring, 2.4.11) ----------------------- */
  --lw-focus-ring-inner:    #181C32;
  --lw-focus-ring-outer:    #FFFFFF;

  /* ---- Overlay / scrim / selection ------------------------- */
  --lw-overlay:             rgba(24, 28, 50, 0.45);
  --lw-scrim:               rgba(24, 28, 50, 0.32);
  --lw-selection-bg:        #E1F0FF;
  --lw-selection-fg:        #181C32;

  /* ---- Tooltip / toast (inverted vs page) ------------------ */
  --lw-tooltip-bg:          #181C32;
  --lw-tooltip-fg:          #F2F4FB;
  --lw-tooltip-border:      #181C32;

  /* ---- Skeleton -------------------------------------------- */
  --lw-skeleton-base:       #EBEDF3;
  --lw-skeleton-sheen:      #F7F9FC;

  /* ---- Elevation composites (light = shadow model) --------- */
  --lw-elev-1-bg:     #FFFFFF; --lw-elev-1-border: #E4E6EF;
  --lw-elev-2-bg:     #FFFFFF; --lw-elev-2-border: #E4E6EF;
  --lw-elev-3-bg:     #FFFFFF; --lw-elev-3-border: #E4E6EF;

  /* ---- Aside (Metronic dark aside is dark in BOTH themes) -- */
  --lw-aside-bg:            #1E1E2D;
  --lw-aside-bg-hover:      #1B1B28;
  --lw-aside-fg:            #9A9CB5;
  --lw-aside-fg-active:     #FFFFFF;
  --lw-aside-divider:       rgba(255, 255, 255, 0.06);

  /* ---- DEPRECATED (documented for migration; do not use) --- */
  --lw-deprecated-magenta: #C11BC1;  /* old dropzone / .chkPurp flood */
  --lw-deprecated-text-muted: #7E8299;   /* replaced by #6B7088 (§2) */
  --lw-deprecated-success-ink: #0D9488;  /* replaced by --lw-success-ink */
  --lw-deprecated-warning-ink: #B8790A;  /* replaced by --lw-warning-ink */
}

/* ============================================================
   DARK THEME — body.dark-mode (production) · .lw-dark-scope (cards)
   Ratios in comments are vs --lw-surface #1A2140 unless stated.
   ============================================================ */
body.dark-mode, .lw-dark-scope {

  /* ---- Brand: original hue already clears AA as text (5.36) - */
  --lw-primary:            #3699FF;
  --lw-primary-ink:        #3699FF;  /* 5.36 · 4.52 on tint */
  --lw-primary-hover:      #5AACFF;
  --lw-primary-active:     #7FC0FF;
  --lw-primary-light:      #14314F;
  --lw-primary-tint:       #14314F;
  --lw-link:               #3699FF;
  --lw-link-hover:         #5AACFF;
  --lw-text-on-primary:    #0B1020;  /* 6.45 */

  /* ---- Text ------------------------------------------------ */
  --lw-dark:               #F2F4FB;  /* headings invert */
  --lw-text-primary:       #F2F4FB;  /* 14.31 */
  --lw-text:               #C9CFE4;  /* 10.13 */
  --lw-text-secondary:     #C9CFE4;
  --lw-text-muted:         #9BA3C0;  /* 6.29 · 4.98 on raised */
  --lw-text-placeholder:   #7A83A3;  /* exempt, 4.20 */
  --lw-text-inverse:       #0B1020;

  /* ---- Surfaces -------------------------------------------- */
  --lw-white:              #1A2140;  /* "white" surfaces become the card surface */
  --lw-bg:                 #0E1327;  /* canvas · 1.17 vs surface */
  --lw-surface:            #1A2140;
  --lw-surface-raised:     #28315C;  /* 1.26 */
  --lw-surface-sunken:     #0A0E20;  /* 1.22 */
  --lw-surface-alt:        #232A4D;
  --lw-surface-hover:      rgba(255, 255, 255, 0.045);

  /* ---- Borders --------------------------------------------- */
  --lw-border:             #3B4674;
  --lw-border-light:       #2C3560;
  --lw-border-strong:      #556193;

  /* ---- Status triple (hue IS the ink; tint darkens) -------- */
  --lw-status-pending:        #FFA800;
  --lw-status-pending-fill:   #FFA800;
  --lw-text-on-warning:       #231703;  /* 9.08 */
  --lw-status-pending-soft:   #3D2D0F;
  --lw-status-pending-tint:   #3D2D0F;
  --lw-status-pending-ink:    #FFA800;  /* 6.87 on tint · 8.13 on surface */

  --lw-status-pass:           #1BC5BD;
  --lw-status-pass-fill:      #1BC5BD;
  --lw-text-on-success:       #0B1020;  /* 8.81 */
  --lw-status-pass-soft:      #143533;
  --lw-status-pass-tint:      #143533;
  --lw-status-pass-ink:       #1BC5BD;  /* 6.16 · 7.31 */

  --lw-status-fail:           #C4283C;
  --lw-status-fail-fill:      #C4283C;
  --lw-text-on-danger:        #FFFFFF;  /* 5.65 */
  --lw-status-fail-soft:      #581A21;
  --lw-status-fail-tint:      #581A21;
  --lw-status-fail-ink:       #FF7A8A;  /* 5.30 · 6.29 */

  --lw-status-disabled:       #556193;
  --lw-status-disabled-fill:  #556193;
  --lw-text-on-disabled:      #F2F4FB;
  --lw-status-disabled-soft:  #2A3052;
  --lw-status-disabled-tint:  #2A3052;
  --lw-status-disabled-ink:   #AEB5CE;  /* 6.27 · 7.71 */

  /* ---- Extended semantic ----------------------------------- */
  --lw-success:            #1BC5BD;
  --lw-success-fill:       #1BC5BD;
  --lw-success-hover:      #3DD3CC;
  --lw-success-light:      #143533;
  --lw-success-tint:       #143533;
  --lw-success-ink:        #1BC5BD;
  --lw-warning:            #FFA800;
  --lw-warning-fill:       #FFA800;
  --lw-warning-light:      #3D2D0F;
  --lw-warning-tint:       #3D2D0F;
  --lw-warning-ink:        #FFA800;
  --lw-danger:             #C4283C;
  --lw-danger-fill:        #C4283C;
  --lw-danger-hover:       #D9384C;
  --lw-danger-light:       #581A21;
  --lw-danger-tint:        #581A21;
  --lw-danger-ink:         #FF7A8A;
  --lw-info:               #B18BFE;
  --lw-info-fill:          #B18BFE;
  --lw-text-on-info:       #0B1020;  /* 7.21 */
  --lw-info-light:         #2E2660;
  --lw-info-tint:          #2E2660;
  --lw-info-ink:           #B18BFE;  /* 5.12 · 5.99 */
  --lw-neutral-tint:       #2A3052;
  --lw-neutral-ink:        #AEB5CE;
  --lw-neutral-fill:       #556193;
  --lw-text-on-neutral:    #F2F4FB;

  /* ---- Secondary / light button = raised surface, not grey - */
  --lw-btn-secondary-bg:       #28315C;
  --lw-btn-secondary-bg-hover: #33407A;
  --lw-btn-secondary-fg:       #F2F4FB;  /* 11.35 */
  --lw-btn-secondary-border:   #6B7AB4;  /* 3.01 on raised */
  --lw-btn-light-bg:           #28315C;
  --lw-btn-light-bg-hover:     #33407A;
  --lw-btn-light-fg:           #F2F4FB;
  --lw-btn-light-border:       #6B7AB4;

  /* ---- Form controls (sunken wells) ------------------------ */
  --lw-input-bg:            #0A0E20;
  --lw-input-bg-hover:      #0E1327;
  --lw-input-bg-disabled:   #171D38;
  --lw-input-bg-readonly:   #171D38;
  --lw-input-border:        #6B7AB4;  /* 3.79 surface · 3.01 raised · 4.44 canvas */
  --lw-input-border-hover:  #8291C4;
  --lw-input-border-focus:  #3699FF;
  --lw-input-border-error:  #FF7A8A;
  --lw-input-fg:            #F2F4FB;
  --lw-input-placeholder:   #7A83A3;
  --lw-input-fg-disabled:   #6A7391;
  --lw-switch-off-track:    #6B7AB4;
  --lw-switch-knob:         #F2F4FB;

  /* ---- Table ----------------------------------------------- */
  --lw-table-header-bg:     #28315C;  /* 1.26 step */
  --lw-table-header-fg:     #9BA3C0;  /* 4.98 */
  --lw-table-row-alt:       #232A4D;
  --lw-table-row-hover:     #232B4F;

  /* ---- Focus ----------------------------------------------- */
  --lw-focus-ring-inner:    #0B1020;
  --lw-focus-ring-outer:    #F2F4FB;

  /* ---- Overlay / scrim / selection (MORE alpha in dark) ---- */
  --lw-overlay:             rgba(3, 6, 16, 0.72);
  --lw-scrim:               rgba(3, 6, 16, 0.58);
  --lw-selection-bg:        #14314F;
  --lw-selection-fg:        #F2F4FB;

  /* ---- Tooltip / toast: LIGHTER than the surface ----------- */
  --lw-tooltip-bg:          #3B4674;  /* 8.7 with fg */
  --lw-tooltip-fg:          #F2F4FB;
  --lw-tooltip-border:      #556193;

  /* ---- Skeleton -------------------------------------------- */
  --lw-skeleton-base:       #232B4F;
  --lw-skeleton-sheen:      #2F3A6B;

  /* ---- Elevation composites (dark = lift + border) --------- */
  --lw-elev-1-bg:     #1A2140; --lw-elev-1-border: #2C3560;
  --lw-elev-2-bg:     #28315C; --lw-elev-2-border: #3B4674;
  --lw-elev-3-bg:     #28315C; --lw-elev-3-border: #556193;

  /* ---- Aside (unchanged — already dark) -------------------- */
  --lw-aside-bg:            #0A0E20;
  --lw-aside-bg-hover:      #14193A;
  --lw-aside-fg:            #9BA3C0;
  --lw-aside-fg-active:     #F2F4FB;
  --lw-aside-divider:       rgba(255, 255, 255, 0.08);

  /* ---- Deprecated (same values, kept for the migration map) - */
  --lw-deprecated-magenta: #C11BC1;
  --lw-deprecated-text-muted: #7E8299;
  --lw-deprecated-success-ink: #0D9488;
  --lw-deprecated-warning-ink: #B8790A;
}

/* Additive "follow system" option. An explicit body class always wins because
   body.dark-mode / body.light-mode carry higher specificity than :root. */

/* ---- source: tokens/typography.css ---- */
/* ============================================================
   LendingWise — Typography Tokens
   Metronic root font-size is 13px (dense, professional). All rem sizes
   below resolve against that 13px root. px equivalents in comments.
   ============================================================ */

:root {
  /* ---- Families ------------------------------------------- */
  --lw-font-sans: 'Poppins', Helvetica, sans-serif;
  --lw-font-mono: 'SFMono-Regular', Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;

  /* ---- Root size (set on :root/body by consumers) --------- */
  --lw-root-size: 13px; /* @kind other */

  /* ---- Weights -------------------------------------------- */
  --lw-fw-light:    300; /* @kind other */
  --lw-fw-normal:   400; /* @kind other */
  --lw-fw-medium:   500; /* @kind other */
  --lw-fw-semibold: 600; /* @kind other */
  --lw-fw-bold:     700; /* @kind other */

  /* ---- Sizes (rem @ 13px root) ---------------------------- */
  --lw-fs-xs:    0.75rem;  /* ~10px  micro labels, table sublabels */
  --lw-fs-sm:    0.85rem;  /* ~11px  pills, captions */
  --lw-fs-md:    0.925rem; /* ~12px  compact table / dense forms */
  --lw-fs-base:  1rem;     /* ~13px  body default */
  --lw-fs-lg:    1.08rem;  /* ~14px  emphasized body / lg controls */
  --lw-fs-xl:    1.25rem;  /* ~16px  h5 */
  --lw-fs-2xl:   1.5rem;   /* ~19.5px h3 / card labels */
  --lw-fs-3xl:   1.75rem;  /* ~22.75px h2 */
  --lw-fs-4xl:   2rem;     /* ~26px  h1 / page title */

  /* ---- Line heights --------------------------------------- */
  --lw-lh-tight:  1.2; /* @kind other */
  --lw-lh-snug:   1.35; /* @kind other */
  --lw-lh-base:   1.5; /* @kind other */

  /* ---- Letter spacing ------------------------------------- */
  --lw-ls-caps: 0.04em; /* @kind other */
}

/* ---- source: tokens/spacing.css ---- */
/* ============================================================
   LendingWise — Spacing, Radius, Shadow, Border & Layout Tokens
   A dense, professional tool: tight spacing, strict alignment grid,
   consistent icon sizing. Scale = 0.25rem (bootstrap/Metronic) steps.
   ============================================================ */

:root {
  /* ---- Spacing scale (rem @ 13px root) -------------------- */
  --lw-sp-1:  0.25rem;  /* 3.25px  hairline gap */
  --lw-sp-2:  0.5rem;   /* 6.5px   dense control gap */
  --lw-sp-3:  0.75rem;  /* 9.75px  table cell / input y-pad */
  --lw-sp-4:  1rem;     /* 13px    default gap */
  --lw-sp-5:  1.25rem;  /* 16px    section gap */
  --lw-sp-6:  1.5rem;   /* 19.5px  card padding (compact) */
  --lw-sp-8:  2rem;     /* 26px    card padding (default) */
  --lw-sp-10: 2.5rem;   /* 32.5px  page gutter */

  /* ---- Component padding (from source) -------------------- */
  --lw-pad-input:      0.65rem 1rem;    /* .form-control */
  --lw-pad-input-sm:   0.55rem 0.75rem; /* .form-control-sm */
  --lw-pad-btn:        0.65rem 1rem;    /* .btn */
  --lw-pad-btn-sm:     0.55rem 0.75rem;
  --lw-pad-cell:       0.75rem;         /* .table td */
  --lw-pad-cell-tight: 0.3rem 0.5rem;   /* .LWcustomTable td (compact) */
  --lw-pad-card:       2rem;            /* .card-body */

  /* ---- Icon sizing (consistent across app) ---------------- */
  --lw-icon-sm:  16px;
  --lw-icon-md:  20px;   /* default UI glyph */
  --lw-icon-lg:  24px;

  /* ---- Control heights ------------------------------------ */
  --lw-h-control:    calc(1.5em + 1.3rem + 2px); /* @kind other */
  --lw-h-control-sm: calc(1.35em + 1.1rem + 2px); /* @kind other */

  /* ---- Radius --------------------------------------------- */
  --lw-radius-sm:   0.28rem;  /* small controls, tags */
  --lw-radius:      0.42rem;  /* DEFAULT — buttons, inputs, cards */
  --lw-radius-lg:   0.85rem;  /* large cards / modals */
  --lw-radius-pill: 2rem;     /* status pills */
  --lw-radius-full: 50%;      /* avatars, dots */

  /* ---- Borders ----------------------------------- @kind spacing */
  --lw-border-width: 1px;
  --lw-border-accent: 3px;    /* status left-border accent on rows/cards */

  /* ---- Shadows (light = shadow elevation model) ------------ */
  --lw-shadow-sm:       0 1px 2px rgba(0, 0, 0, 0.075);
  --lw-shadow-card:     0 0 30px 0 rgba(82, 63, 105, 0.05);
  --lw-shadow-hover:    0 3px 8px rgba(0, 0, 0, 0.12);
  --lw-shadow-dropdown: 0 0 50px 0 rgba(82, 63, 105, 0.15);
  --lw-shadow-focus:    0 0 0 0.2rem rgba(84, 168, 255, 0.5); /* legacy; prefer the two-tone ring */
  /* Dark elevation shadows (secondary cue; surface lift + border is primary) */
  --lw-shadow-sm-dark:       0 1px 2px rgba(0, 0, 0, 0.30);
  --lw-shadow-card-dark:     0 2px 8px rgba(0, 0, 0, 0.40);
  --lw-shadow-dropdown-dark: 0 8px 24px rgba(0, 0, 0, 0.55);
  --lw-shadow-hover-dark:    0 16px 48px rgba(0, 0, 0, 0.65);

  /* ---- Layout chrome (from source) --------------- @kind spacing */
  --lw-header-height:    65px;
  --lw-card-header-min:  50px;
  --lw-z-dropdown:  1000; /* @kind other */
  --lw-z-sticky:    1020; /* @kind other */
  --lw-z-modal:     1050; /* @kind other */
  --lw-z-toast:     1090; /* @kind other */

  /* ---- Motion ------------------------------------ */
  --lw-transition: 0.3s ease-in-out;   /* @kind other */
  --lw-transition-fast: 0.15s ease;    /* @kind other */
}

/* Dark: bind the shared shadow names to the high-alpha set so components
   keep referencing one token. */
body.dark-mode, .lw-dark-scope {
  --lw-shadow-sm:       var(--lw-shadow-sm-dark);
  --lw-shadow-card:     var(--lw-shadow-card-dark);
  --lw-shadow-hover:    var(--lw-shadow-hover-dark);
  --lw-shadow-dropdown: var(--lw-shadow-dropdown-dark);
}

/* ---- source: tokens/charts.css ---- */
/* ============================================================
   LendingWise — Data Visualisation Tokens (both themes)
   Palettes were CVD-validated (light on #FFFFFF, dark on #1A2140).
   CATEGORICAL: assign --lw-chart-1..8 in FIXED order, never cycled.
     Series cap for scatter/bubble/choropleth/small multiples: slots 1–3 only.
     Relief rule (light): slots 3, 4, 5 sit below 3:1 on white → charts using
     them MUST ship direct labels or a table view.
   Status colours are RESERVED — never reuse them as a series colour.
   Chart text always wears text tokens, never a series colour.
   JS libraries must read these via getComputedStyle(document.body)
   .getPropertyValue('--lw-chart-1').trim() and re-read on theme change.
   ============================================================ */
:root {
  --lw-chart-1: #1C6FD6;  /* blue — LendingWise blue's chart step */
  --lw-chart-2: #EB6834;  /* orange */
  --lw-chart-3: #1BAF7A;  /* aqua   (2.82 on white — relief rule) */
  --lw-chart-4: #EDA100;  /* yellow (2.17 — relief rule) */
  --lw-chart-5: #E87BA4;  /* magenta(2.69 — relief rule) */
  --lw-chart-6: #008300;  /* green */
  --lw-chart-7: #4A3AA7;  /* violet */
  --lw-chart-8: #E34948;  /* red */

  --lw-chart-seq-1: #84B9FF;
  --lw-chart-seq-2: #5A9DF0;
  --lw-chart-seq-3: #2F7AD3;
  --lw-chart-seq-4: #175BA8;
  --lw-chart-seq-5: #0B3B71;

  --lw-chart-div-1: #0F6F6A;  /* pass arm (dark end) */
  --lw-chart-div-2: #3E9F98;
  --lw-chart-div-3: #6FBDB6;
  --lw-chart-div-4: #B0B7CA;  /* neutral grey midpoint (2.01) */
  --lw-chart-div-5: #F2909F;
  --lw-chart-div-6: #DE4F66;
  --lw-chart-div-7: #B01528;  /* fail arm (dark end) */

  --lw-chart-grid:    #EBEDF3;
  --lw-chart-axis:    #D1D3E0;
  --lw-chart-label:   #6B7088;
  --lw-chart-surface: #FFFFFF;
}

body.dark-mode, .lw-dark-scope {
  --lw-chart-1: #3987E5;
  --lw-chart-2: #D95926;
  --lw-chart-3: #199E70;
  --lw-chart-4: #C98500;
  --lw-chart-5: #D55181;
  --lw-chart-6: #008300;
  --lw-chart-7: #9085E9;
  --lw-chart-8: #E66767;

  --lw-chart-seq-1: #2C5496;
  --lw-chart-seq-2: #3D74C2;
  --lw-chart-seq-3: #5697E4;
  --lw-chart-seq-4: #7BB6F5;
  --lw-chart-seq-5: #A8D0FC;

  --lw-chart-div-1: #4FD3C8;
  --lw-chart-div-2: #22B0A7;
  --lw-chart-div-3: #2E8F88;
  --lw-chart-div-4: #5C6684;  /* midpoint 2.76 */
  --lw-chart-div-5: #B8303F;
  --lw-chart-div-6: #E45A6E;
  --lw-chart-div-7: #F4909E;

  --lw-chart-grid:    #2C3560;
  --lw-chart-axis:    #3B4674;
  --lw-chart-label:   #9BA3C0;
  --lw-chart-surface: #1A2140;
}
