/* Forgeworks / Anvil — design tokens (ANVIL-BRIEF.md §4).
   The single source of truth for color, type, space, radii, elevation and
   motion. Loaded before index.css (see main.jsx) so every rule resolves
   against these. Dark is the default theme; light is a full value-set swap
   on the same names (§4.3). Density swaps token VALUES, never components. */

:root {
  /* ── color: ground ── */
  --fw-bg:            #0B0E14;  /* page ground */
  --fw-surface-1:     #13181F;  /* cards, rails, bars */
  --fw-surface-2:     #1A2030;  /* raised: menus, inputs, hover */
  --fw-surface-3:     #222A3C;  /* highest: active states */
  --fw-border:        #1E2A3A;
  --fw-border-strong: #2E3D52;

  /* ── color: ink ── */
  --fw-ink:           #F0F4F8;
  --fw-ink-muted:     #8A99AC;  /* AA at 12px+ on all surfaces */
  --fw-ink-faint:     #6B7A8D;  /* non-text only: borders, dots, disabled glyphs */

  /* ── color: brand & status ── */
  --fw-accent:        #3ECFFF;
  --fw-accent-dim:    rgba(62, 207, 255, 0.12);
  --fw-ok:            #22C55E;
  --fw-warn:          #F9CB42;
  --fw-danger:        #E24B4A;  /* fills, borders, badges */
  --fw-danger-text:   #F0716F;  /* small error text on dark */
  --fw-info:          #4A9DE2;  /* in-progress states */
  --fw-special:       #B08CF9;  /* workflow / automation purple */

  /* ── product hues (switcher, lens accents) ── */
  --fw-stream:        #3ECFFF;  /* Stream inherits the brand accent */
  --fw-shift:         #FFB454;
  --fw-load:          #5CE0A1;

  /* ── derived tints (the kit color-mixes these; flip with the theme) ── */
  --fw-accent-dim2:   rgba(62, 207, 255, 0.20);
  --fw-accent-soft:   rgba(62, 207, 255, 0.25);
  --fw-row-hover:     rgba(62, 207, 255, 0.05);
  --fw-row-border:    rgba(30, 42, 58, 0.5);

  /* ── type: families ── */
  --fw-font-ui:   'DM Sans', system-ui, sans-serif;
  --fw-font-mono: 'DM Mono', ui-monospace, monospace;

  /* ── type: scale (§2.2) — fixed sizes, paired line heights ── */
  --fw-text-display:      22px;  --fw-text-display-lh:  28px;  /* page titles */
  --fw-text-title:        16px;  --fw-text-title-lh:    22px;  /* section/card/modal heads */
  --fw-text-body:         14px;  --fw-text-body-lh:     20px;  /* default UI text */
  --fw-text-body-sm:      13px;  --fw-text-body-sm-lh:  18px;  /* dense cells, secondary copy */
  --fw-text-caption:      12px;  --fw-text-caption-lh:  16px;  /* labels, hints, timestamps — floor for persistent text */
  --fw-text-micro:        11px;  --fw-text-micro-lh:    14px;  /* mono ids, coordinates, badge glyphs */
  --fw-text-overline:     11px;  --fw-text-overline-lh: 14px;  /* caps section labels */

  /* ── space & radii (§2.3) ── */
  --fw-space-1: 4px;  --fw-space-2: 8px;  --fw-space-3: 12px;
  --fw-space-4: 16px; --fw-space-5: 24px; --fw-space-6: 32px;
  --fw-radius-sm: 4px; --fw-radius-md: 6px; --fw-radius-lg: 8px; --fw-radius-pill: 999px;

  /* ── elevation ── */
  --fw-shadow-menu:  0 8px 24px rgba(0, 0, 0, 0.45);
  --fw-shadow-modal: 0 12px 40px rgba(0, 0, 0, 0.55);

  /* ── motion ── */
  --fw-pulse: 1.6s ease-out;  /* flash on fresh rows */
  --fw-fast:  0.12s ease;     /* hovers, toggles */
}

/* ── density (§2.4) — comfortable is the default ── */
:root {
  --fw-body:        14px;
  --fw-body-lh:     20px;
  --fw-row-h:       36px;     /* table rows */
  --fw-feed-row-h:  34px;     /* live feed rows */
  --fw-control-pad: 6px 12px;
}
:root[data-density="compact"] {
  --fw-body:        13px;
  --fw-body-lh:     18px;
  --fw-row-h:       28px;
  --fw-feed-row-h:  28px;
  --fw-control-pad: 4px 8px;
}

/* ── light theme (§4.3 — AA-verified value swap; components never branch) ── */
:root[data-theme="light"] {
  /* ── color: ground ── */
  --fw-bg:            #F2F5F9;
  --fw-surface-1:     #FFFFFF;
  --fw-surface-2:     #EAEFF5;
  --fw-surface-3:     #DEE6EF;
  --fw-border:        #D8E0EA;
  --fw-border-strong: #AEBCCC;

  /* ── color: ink ── */
  --fw-ink:           #18212E;
  --fw-ink-muted:     #54657A;  /* AA on every surface */
  --fw-ink-faint:     #8A99AC;  /* non-text only */

  /* ── color: brand & status ── */
  --fw-accent:        #0A6E8F;  /* brand cyan, darkened for light ground */
  --fw-accent-dim:    rgba(10, 110, 143, 0.10);
  --fw-ok:            #0E6F36;
  --fw-warn:          #8A5C00;
  --fw-danger:        #C73B34;  /* fills, borders, badges */
  --fw-danger-text:   #B3362F;  /* small error text on light */
  --fw-info:          #1A63A8;
  --fw-special:       #7140C8;

  /* ── product hues ── */
  --fw-stream:        #0A6E8F;
  --fw-shift:         #915408;
  --fw-load:          #11713F;

  /* ── derived tints ── */
  --fw-accent-dim2:   rgba(10, 110, 143, 0.18);
  --fw-accent-soft:   rgba(10, 110, 143, 0.30);
  --fw-row-hover:     rgba(10, 110, 143, 0.06);
  --fw-row-border:    rgba(174, 188, 204, 0.5);

  /* ── elevation (softer on light) ── */
  --fw-shadow-menu:  0 8px 24px rgba(20, 30, 45, 0.15);
  --fw-shadow-modal: 0 12px 40px rgba(20, 30, 45, 0.22);
}
