/* ============================================================================
   CITADEL — theme tokens (light default + designed dark)
   Domain: Governance, Risk & Compliance (GRC).
   Identity: deep INDIGO / VIOLET primary, TEAL accent, AMBER for gaps/warnings.
   Every color a chart needs is a CSS custom property here, read via APP.palette().
   Light is the primary design target; dark is DESIGNED (not inverted).
   ============================================================================ */

/* ---- Type imports (Inter + IBM Plex Mono for tabular figures) ---- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  /* ----- Type system ----- */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'IBM Plex Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;

  /* type scale (dense BI, 13.5px base) */
  --fs-micro: 10.5px;
  --fs-xs:    11.5px;
  --fs-sm:    12.5px;
  --fs-base:  13.5px;
  --fs-md:    15px;
  --fs-lg:    18px;
  --fs-xl:    22px;
  --fs-2xl:   28px;
  --fs-3xl:   36px;
  --fs-kpi:   30px;

  /* spacing scale */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-7: 32px; --sp-8: 44px;

  --radius:    10px;
  --radius-sm: 6px;
  --radius-lg: 14px;

  /* z-scale (semantic) */
  --z-base: 1; --z-sticky: 100; --z-chip: 150; --z-dropdown: 300;
  --z-tooltip: 800; --z-modal: 900;

  /* motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
  --dur-fast: 140ms; --dur: 240ms; --dur-slow: 420ms;
}

/* ===========================================================================
   LIGHT THEME  (default)
   =========================================================================== */
:root, [data-theme='light'] {
  color-scheme: light;

  /* surfaces & ink (cool indigo-tinted neutrals) */
  --c-bg:        #F6F6FB;
  --c-bg-tint:   #EEEEF7;   /* faint section banding */
  --c-surface:   #FFFFFF;
  --c-surface-2: #F3F3FA;   /* nested wells, table header */
  --c-ink:       #1B1B33;   /* primary text (deep indigo-black) */
  --c-ink-soft:  #353556;   /* secondary text */
  --c-muted:     #62627F;   /* tertiary / captions */
  --c-faint:     #9A9AB4;   /* axis ticks, de-emphasis */
  --c-hairline:  #E5E5F0;   /* borders, gridlines */
  --c-hairline-2:#EFEFF6;   /* lighter gridlines */

  /* brand / signal roles — CITADEL indigo→violet */
  --c-brand:     #4F46E5;   /* primary indigo */
  --c-brand-2:   #6D28D9;   /* violet (gradient end / darker brand) */
  --c-brand-3:   #3730A3;   /* deep indigo (pressed/active) */
  --c-brand-soft:#E5E3FB;   /* indigo tint fill */
  --c-brand-softer:#F0EFFD;
  --c-accent:    #0E9F9A;   /* teal accent */
  --c-accent-2:  #0B7E7A;
  --c-accent-soft:#D2EFEE;
  --c-warn:      #E0A800;   /* amber — gaps / warnings */
  --c-warn-2:    #B98900;
  --c-warn-soft: #FBF0CC;

  /* status semantics (good is NOT always green) */
  --c-good:      #1E9E6A;   /* effective / on-track / closed-good (green) */
  --c-good-soft: #D6F0E4;
  --c-mid:       #E0A800;   /* partial / in-progress (amber) */
  --c-mid-soft:  #FBF0CC;
  --c-bad:       #DC3545;   /* ineffective / overdue / breach (red) */
  --c-bad-soft:  #FADBDE;
  --c-info:      #4F46E5;   /* neutral/informational (indigo) */
  --c-info-soft: #E5E3FB;

  /* RISK ramp — 5-step green -> amber -> red (likelihood*impact severity) */
  --c-risk-1: #1E9E6A;   /* low (green) */
  --c-risk-2: #8FB94B;   /* low-med (yellow-green) */
  --c-risk-3: #E0A800;   /* medium (amber) */
  --c-risk-4: #E8702A;   /* high (orange) */
  --c-risk-5: #DC3545;   /* critical (red) */
  /* soft tints for matrix cell fills */
  --c-risk-1-soft: #DEF2E8;
  --c-risk-2-soft: #EBF2D9;
  --c-risk-3-soft: #FBF0CC;
  --c-risk-4-soft: #FBE2D2;
  --c-risk-5-soft: #FADBDE;

  /* SEQUENTIAL indigo ramp (heatmaps: low -> high intensity, single hue) */
  --c-seq-0: #F1F0FC;
  --c-seq-1: #DAD7F7;
  --c-seq-2: #B8B2F0;
  --c-seq-3: #8E84E6;
  --c-seq-4: #6557DB;
  --c-seq-5: #4232B0;

  /* DIVERGING ramp (vs target / appetite: bad <- neutral -> good) */
  --c-div-neg2: #DC3545;
  --c-div-neg1: #E89197;
  --c-div-mid:  #ECECF3;
  --c-div-pos1: #87C9A9;
  --c-div-pos2: #1E9E6A;

  /* CATEGORICAL palette (risk categories) — <=6 hues, colorblind-aware */
  --c-cat-cyber:      #4F46E5;   /* indigo */
  --c-cat-operational:#0E9F9A;   /* teal */
  --c-cat-financial:  #E0A800;   /* amber */
  --c-cat-compliance: #9333EA;   /* violet */
  --c-cat-strategic:  #2E7CE4;   /* blue */
  --c-cat-thirdparty: #E8702A;   /* orange */

  /* CONTROL status semantics */
  --c-ctl-effective:  #1E9E6A;
  --c-ctl-partial:    #E0A800;
  --c-ctl-ineffective:#DC3545;
  --c-ctl-nottested:  #9A9AB4;
  --c-ctl-effective-soft:  #D6F0E4;
  --c-ctl-partial-soft:    #FBF0CC;
  --c-ctl-ineffective-soft:#FADBDE;
  --c-ctl-nottested-soft:  #ECECF3;

  /* FRAMEWORK identity hues (for multi-line / framework legends) */
  --c-fw-iso:   #4F46E5;   /* ISO 27001 — indigo */
  --c-fw-soc2:  #0E9F9A;   /* SOC 2 — teal */
  --c-fw-nist:  #9333EA;   /* NIST CSF — violet */
  --c-fw-gdpr:  #E8702A;   /* GDPR — orange */

  /* chart furniture */
  --c-grid:      #EAEAF3;
  --c-axis:      #C3C3D6;
  --c-axis-text: #62627F;
  --c-target:    #62627F;   /* target / appetite / reference lines */
  --c-context:   #C9C9DD;   /* de-emphasized "context" marks (gray workhorse) */

  /* ui chrome */
  --c-chip-bg:   #ECEBFA;
  --c-chip-ink:  #3E36B5;
  --c-chip-border:#D6D3F4;
  --c-control-bg:#FFFFFF;
  --c-control-border:#D8D8E6;
  --c-control-ink:#2A2A47;
  --c-focus:     #4F46E5;
  --c-shadow:    0 1px 2px rgba(27,27,51,.05), 0 4px 14px rgba(27,27,51,.06);
  --c-shadow-lg: 0 6px 30px rgba(55,48,163,.14);
  --c-positive:  #1E9E6A;  /* delta good */
  --c-negative:  #DC3545;  /* delta bad */
  --c-tooltip-bg:#1B1B33;
  --c-tooltip-ink:#F3F3FA;
}

/* ===========================================================================
   DARK THEME  (designed — near-black indigo bg, desaturated/brightened data)
   =========================================================================== */
[data-theme='dark'] {
  color-scheme: dark;

  --c-bg:        #0B0B1A;   /* near-black indigo */
  --c-bg-tint:   #10102099;
  --c-surface:   #14142A;
  --c-surface-2: #1C1C38;
  --c-ink:       #ECECF7;
  --c-ink-soft:  #C2C2DB;
  --c-muted:     #8E8EAE;
  --c-faint:     #61617E;
  --c-hairline:  #262649;
  --c-hairline-2:#1D1D3A;

  --c-brand:     #8B82F5;   /* brightened indigo */
  --c-brand-2:   #A78BFA;   /* brightened violet */
  --c-brand-3:   #6D63E8;
  --c-brand-soft:#23234A;
  --c-brand-softer:#1B1B3A;
  --c-accent:    #2DC2BC;   /* brightened teal */
  --c-accent-2:  #4FD4CE;
  --c-accent-soft:#0E3A38;
  --c-warn:      #F2C24B;   /* brightened amber */
  --c-warn-2:    #FFD56B;
  --c-warn-soft: #3A2F0C;

  --c-good:      #45C68C;
  --c-good-soft: #103526;
  --c-mid:       #F2C24B;
  --c-mid-soft:  #3A2F0C;
  --c-bad:       #F0606E;
  --c-bad-soft:  #3A1419;
  --c-info:      #8B82F5;
  --c-info-soft: #23234A;

  /* RISK ramp — desaturated/brightened for dark */
  --c-risk-1: #45C68C;
  --c-risk-2: #A6CC63;
  --c-risk-3: #F2C24B;
  --c-risk-4: #F08A4B;
  --c-risk-5: #F0606E;
  --c-risk-1-soft: #133127;
  --c-risk-2-soft: #2A3318;
  --c-risk-3-soft: #38300F;
  --c-risk-4-soft: #3A2615;
  --c-risk-5-soft: #381720;

  /* SEQUENTIAL indigo ramp (dark) */
  --c-seq-0: #181834;
  --c-seq-1: #242253;
  --c-seq-2: #34307A;
  --c-seq-3: #4B45A8;
  --c-seq-4: #6A63D4;
  --c-seq-5: #9B92F2;

  --c-div-neg2: #F0606E;
  --c-div-neg1: #9A4750;
  --c-div-mid:  #2C2C50;
  --c-div-pos1: #2F7556;
  --c-div-pos2: #45C68C;

  --c-cat-cyber:      #8B82F5;
  --c-cat-operational:#2DC2BC;
  --c-cat-financial:  #F2C24B;
  --c-cat-compliance: #B98AF0;
  --c-cat-strategic:  #5C9DF0;
  --c-cat-thirdparty: #F08A4B;

  --c-ctl-effective:  #45C68C;
  --c-ctl-partial:    #F2C24B;
  --c-ctl-ineffective:#F0606E;
  --c-ctl-nottested:  #61617E;
  --c-ctl-effective-soft:  #103526;
  --c-ctl-partial-soft:    #3A2F0C;
  --c-ctl-ineffective-soft:#3A1419;
  --c-ctl-nottested-soft:  #20203E;

  --c-fw-iso:   #8B82F5;
  --c-fw-soc2:  #2DC2BC;
  --c-fw-nist:  #B98AF0;
  --c-fw-gdpr:  #F08A4B;

  --c-grid:      #1F1F3D;
  --c-axis:      #34345A;
  --c-axis-text: #8E8EAE;
  --c-target:    #8E8EAE;
  --c-context:   #34345A;

  --c-chip-bg:   #23234A;
  --c-chip-ink:  #B7B0F5;
  --c-chip-border:#2F2F5C;
  --c-control-bg:#1C1C38;
  --c-control-border:#2E2E54;
  --c-control-ink:#D9D9EC;
  --c-focus:     #8B82F5;
  --c-shadow:    0 1px 2px rgba(0,0,0,.45), 0 4px 16px rgba(0,0,0,.45);
  --c-shadow-lg: 0 8px 36px rgba(0,0,0,.6);
  --c-positive:  #45C68C;
  --c-negative:  #F0606E;
  --c-tooltip-bg:#05050F;
  --c-tooltip-ink:#ECECF7;
}

/* ---- global number rendering: tabular figures everywhere ---- */
.tnum, .kpi-value, table td, table th, .axis text, .chart-num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum' 1, 'cv01' 1;
}

* { box-sizing: border-box; }
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
