/*
 * BizChecker AI — shared design tokens (UIUX-1.1)
 *
 * Single semantic layer for marketing (dark-first) and report (light/system
 * via the existing body.light + localStorage `bca_th` toggle). Both surfaces
 * already switch with `body.light`; this file does NOT add prefers-color-scheme
 * on :root, because that would flip the marketing homepage without the toggle.
 *
 * Brand hex lives here. Pilot pages (index.html, report.html) alias their
 * legacy --bg/--t2/--p names to these tokens. Do not re-declare these
 * semantic names in other stylesheets.
 */

:root {
  /* ---- primitive: neutral scale ---- */
  --neutral-0: #ffffff;
  --neutral-50: #f7f6ff;
  --neutral-100: #f0eeff;
  --neutral-150: #e8e5ff;
  --neutral-200: #e0ddf8;
  --neutral-300: #c6c4ec;
  --neutral-400: #7d7daf;
  --neutral-500: #56527d;
  --neutral-600: #555578;
  --neutral-700: #3d3b60;
  --neutral-800: #14142a;
  --neutral-850: #0e0e1c;
  --neutral-900: #0a0a16;
  --neutral-950: #06060d;
  --neutral-1000: #040408;

  /* ---- primitive: brand ---- */
  --brand-400: #a78bff;
  --brand-500: #8b5cf6;
  --brand-600: #7c3aed;
  --brand-700: #6937cf;
  --brand-800: #6423c9;
  --brand-900: #5b21b6;
  --brand-tint: rgba(124, 58, 237, .15);

  /* ---- primitive: verdict ---- */
  --verdict-success: #10b981;
  --verdict-success-strong: #066846;
  --verdict-success-tint: rgba(16, 185, 129, .12);
  --verdict-danger: #ef4444;
  --verdict-danger-strong: #b4232d;
  --verdict-warning: #f59e0b;
  --verdict-warning-strong: #925500;

  /* ---- semantic: ink / paper (dark default) ---- */
  --color-paper: var(--neutral-950);
  --color-paper-2: var(--neutral-900);
  --color-paper-3: var(--neutral-850);
  --color-paper-4: var(--neutral-800);
  --color-ink: #f2f1ff;
  --color-ink-muted: var(--neutral-300);
  --color-ink-subtle: var(--neutral-400);
  --color-ink-faint: var(--neutral-600);

  /* ---- semantic: glass (marketing elevation; unused on report) ---- */
  --color-glass: rgba(255, 255, 255, .035);
  --color-glass-strong: rgba(255, 255, 255, .06);

  /* ---- semantic: primary ---- */
  --color-primary: var(--brand-600);
  --color-primary-strong: var(--brand-500);
  --color-primary-soft: var(--brand-400);
  --color-primary-tint: var(--brand-tint);

  /* ---- semantic: verdict ---- */
  --color-success: var(--verdict-success);
  --color-success-tint: var(--verdict-success-tint);
  --color-danger: var(--verdict-danger);
  --color-warning: var(--verdict-warning);

  /* ---- semantic: border ---- */
  --color-border: rgba(255, 255, 255, .07);
  --color-border-strong: rgba(255, 255, 255, .12);
  --color-border-accent: rgba(139, 92, 246, .22);
  --border-width-hairline: 1px;
  --border-width-thick: 2px;

  /* ---- semantic: spacing (4px scale; adopt later, do not rewrite markup now) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* ---- semantic: radius ---- */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 12px;
  --radius-2xl: 16px;
  --radius-3xl: 20px;
  --radius-4xl: 24px;

  /* ---- semantic: shadow ---- */
  --shadow-card: 0 4px 18px rgba(0, 0, 0, .35), 0 1px 3px rgba(0, 0, 0, .25);
  --shadow-lift: 0 10px 36px rgba(0, 0, 0, .55), 0 2px 8px rgba(0, 0, 0, .4);
  --shadow-glow: 0 0 32px rgba(124, 127, 255, .18);

  /* ---- semantic: z-index (adopt later) ---- */
  --z-base: 1;
  --z-raised: 2;
  --z-nav: 200;
  --z-dropdown: 200;
  --z-overlay: 500;
  --z-noise: 999;
  --z-modal: 1000;
  --z-popover: 9999;

  /* ---- type ---- */
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'SF Mono', ui-monospace, monospace;
}

body.light {
  --color-paper: var(--neutral-50);
  --color-paper-2: var(--neutral-100);
  --color-paper-3: var(--neutral-150);
  --color-paper-4: var(--neutral-200);
  --color-ink: #0d0c1a;
  --color-ink-muted: var(--neutral-700);
  --color-ink-subtle: var(--neutral-500);
  --color-ink-faint: var(--neutral-600);

  --color-glass: rgba(0, 0, 0, .035);
  --color-glass-strong: rgba(0, 0, 0, .06);

  --color-primary: var(--brand-800);
  --color-primary-strong: var(--brand-700);
  --color-primary-soft: var(--brand-900);

  --color-success: var(--verdict-success-strong);
  --color-danger: var(--verdict-danger-strong);
  --color-warning: var(--verdict-warning-strong);

  --color-border: rgba(0, 0, 0, .08);
  --color-border-strong: rgba(0, 0, 0, .12);
  --color-border-accent: rgba(124, 58, 237, .18);
}
