/* Flintt design tokens — where colors live. app.css has exactly three hex/rgb/hsl literals,
   and they are deliberate: .mtile's hsl(var(--h,210) 50% 42%), whose hue sellerHue() in
   core/dom.js computes per seller and sets as an inline --h, so it cannot live in a token;
   .fb-tab's color:#fff, a fixed on-ink white over --ink, which is theme-independent by
   design; and .suprules' box-shadow rgba(0,0,0,.22). Add no others.

   Theme resolution: a `data-theme` attribute on <html> wins ("light" | "dark");
   with no attribute the OS preference applies. app.js persists the choice in
   localStorage("flintt.theme") = "system" | "light" | "dark" and index.html applies
   it pre-paint. Keep the two dark blocks below in sync (same declarations). */

/* ---------- theme-independent (type, spacing, motion) -------------------------------- */
:root{
  --font-sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue","Segoe UI",ui-sans-serif,system-ui,sans-serif;
  --font-mono:"SF Mono",ui-monospace,"JetBrains Mono","Cascadia Mono",Menlo,monospace;
  --font-size-label:11px;--font-size-body:13px;--font-size-title:15px;--font-size-mono:12px;
  --font-weight-medium:500;--font-weight-strong:600;--font-weight-selected:700;
  --line-body:1.5;
  --radius-sm:8px;--radius-md:10px;--radius-lg:12px;--radius-pill:9px;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;
  --space-card:14px;
  --tracking-body:-0.011em;
  --dur-fast:180ms;
  --ease:cubic-bezier(.22,1,.36,1);
  --ink:#e11d48; /* feedback pen — annotation red, identical in both themes */
}

/* ---------- light (default) ----------------------------------------------------------- */
:root{
  color-scheme:light;
  --surface-page:#fafafb;--surface-card:#ffffff;--surface-raised:#f1f3f6;--surface-inset:#f3f5f8;
  --surface-side:#f1f2f5; /* left sidebar */
  --surface-tool:#16181c;
  --text-primary:#0d0e10;--text-secondary:#494d55;--text-tertiary:#5a5f68;--text-muted:#8b9099;
  --text-on-accent:#ffffff;--text-on-tool:#f8f8f8;
  --accent:#0d0e10;--accent-strong:#2a2c30;--accent-soft:#e9ecf2;--accent-soft-line:#d4d8e0;
  /* The AGENT hue, and the only hue in this file. Everything else here is deliberately
     monochrome so that COLOR always means something about the data — stock, lifecycle, risk.
     An indigo that appears on no supply surface can therefore mean exactly one thing wherever
     it turns up: this is the agent lane. Never use it on an offer, a price or a status. */
  --ai:#5b4fd6;--ai-strong:#4a3fc4;--ai-soft:rgba(91,79,214,0.08);--ai-line:rgba(91,79,214,0.28);
  --ai-on:#ffffff;
  --success:#15803d;--success-soft:#e8f3ec;--success-line:#b7d9c4;
  --warning:#9a6500;--warning-soft:#fbf1de;--warning-line:#e6cf9e;
  --error:#c4231f;--error-soft:#fbeae9;--error-line:#efc5c3;
  --border:rgba(10,12,16,0.12);--border-strong:rgba(10,12,16,0.18);
  --focus-ring:rgba(13,14,16,0.45);
  --scrim:rgba(10,12,16,0.42);
  --skel-sheen:rgba(255,255,255,0.5);
  --shadow-float:0 1px 0 rgba(255,255,255,.05) inset, 0 24px 60px -20px rgba(0,0,0,.7);
  --shadow-pop:0 4px 18px rgba(0,0,0,.28);
  /* EDA drawings (core/kicadsvg.js): KiCad's own light-canvas palette. */
  --eda-paper:#fffdf5;
  --eda-line:#7a1f1f;--eda-body:#fff7df;--eda-pin-num:#555555;--eda-pin-name:#1f5f5b;
  --eda-fp-body:#e8e2d4;--eda-fp-body-line:#8a8377;
  --eda-pad-smd:#c87137;--eda-pad-thru:#b8860b;--eda-pad-np:#9aa0a6;
  --eda-drill:#ffffff;--eda-drill-edge:#666666;--eda-pad-num:#ffffff;
  --eda-fcu:#c87137;--eda-bcu:#6b8fbf;--eda-silk-f:#444444;--eda-silk-b:#777777;
  --eda-fab:#9aa0a6;--eda-edge:#8f7bbf;
}

/* ---------- dark (manual choice) -------------------------------------------------------- */
:root[data-theme="dark"]{
  color-scheme:dark;
  --surface-page:#0e0f12;--surface-card:#16181d;--surface-raised:#1e2127;--surface-inset:#121419;
  --surface-side:#121419;
  --surface-tool:#16181c;
  --text-primary:#e8eaee;--text-secondary:#aab0ba;--text-tertiary:#868c96;--text-muted:#61666f;
  --text-on-accent:#0d0e10;--text-on-tool:#f8f8f8;
  --accent:#e8eaee;--accent-strong:#ffffff;--accent-soft:#24272e;--accent-soft-line:#353a43;
  --ai:#a99cff;--ai-strong:#c1b8ff;--ai-soft:rgba(169,156,255,0.13);--ai-line:rgba(169,156,255,0.32);
  --ai-on:#14121f;
  --success:#4cc380;--success-soft:#13271b;--success-line:#23553a;
  --warning:#e0b25e;--warning-soft:#2a2213;--warning-line:#5c4a24;
  --error:#ef6f6a;--error-soft:#2c1614;--error-line:#6b3230;
  --border:rgba(255,255,255,0.10);--border-strong:rgba(255,255,255,0.17);
  --focus-ring:rgba(232,234,238,0.45);
  --scrim:rgba(0,0,0,0.55);
  --skel-sheen:rgba(255,255,255,0.06);
  --shadow-float:0 1px 0 rgba(255,255,255,.05) inset, 0 24px 60px -20px rgba(0,0,0,.7);
  --shadow-pop:0 4px 18px rgba(0,0,0,.28);
  /* EDA drawings on a dark canvas — KiCad's own dark-theme reading: the outline red
     lightens to stay legible (the #7a1f1f original vanishes on a dark surface) and the
     paper darkens, so a 300px expanded drawing is not a slab of glare. */
  --eda-paper:#101216;
  --eda-line:#ef6f6a;--eda-body:#241f16;--eda-pin-num:#9aa0a6;--eda-pin-name:#6ec7bf;
  --eda-fp-body:#2a2620;--eda-fp-body-line:#6b6459;
  --eda-pad-smd:#e08a4a;--eda-pad-thru:#d4a017;--eda-pad-np:#8b9099;
  --eda-drill:#101216;--eda-drill-edge:#8b9099;--eda-pad-num:#1a140c;
  --eda-fcu:#e08a4a;--eda-bcu:#7fa8e0;--eda-silk-f:#c9ccd1;--eda-silk-b:#8b9099;
  --eda-fab:#8b9099;--eda-edge:#a992e0;
}

/* ---------- dark (OS preference, no manual choice) ---------------------------------------- */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --surface-page:#0e0f12;--surface-card:#16181d;--surface-raised:#1e2127;--surface-inset:#121419;
    --surface-side:#121419;
    --surface-tool:#16181c;
    --text-primary:#e8eaee;--text-secondary:#aab0ba;--text-tertiary:#868c96;--text-muted:#61666f;
    --text-on-accent:#0d0e10;--text-on-tool:#f8f8f8;
    --accent:#e8eaee;--accent-strong:#ffffff;--accent-soft:#24272e;--accent-soft-line:#353a43;
    --ai:#a99cff;--ai-strong:#c1b8ff;--ai-soft:rgba(169,156,255,0.13);--ai-line:rgba(169,156,255,0.32);
    --ai-on:#14121f;
    --success:#4cc380;--success-soft:#13271b;--success-line:#23553a;
    --warning:#e0b25e;--warning-soft:#2a2213;--warning-line:#5c4a24;
    --error:#ef6f6a;--error-soft:#2c1614;--error-line:#6b3230;
    --border:rgba(255,255,255,0.10);--border-strong:rgba(255,255,255,0.17);
    --focus-ring:rgba(232,234,238,0.45);
    --scrim:rgba(0,0,0,0.55);
    --skel-sheen:rgba(255,255,255,0.06);
    --shadow-float:0 1px 0 rgba(255,255,255,.05) inset, 0 24px 60px -20px rgba(0,0,0,.7);
    --shadow-pop:0 4px 18px rgba(0,0,0,.28);
    /* EDA drawings on a dark canvas — KiCad's own dark-theme reading: the outline red
       lightens to stay legible (the #7a1f1f original vanishes on a dark surface) and the
       paper darkens, so a 300px expanded drawing is not a slab of glare. */
    --eda-paper:#101216;
    --eda-line:#ef6f6a;--eda-body:#241f16;--eda-pin-num:#9aa0a6;--eda-pin-name:#6ec7bf;
    --eda-fp-body:#2a2620;--eda-fp-body-line:#6b6459;
    --eda-pad-smd:#e08a4a;--eda-pad-thru:#d4a017;--eda-pad-np:#8b9099;
    --eda-drill:#101216;--eda-drill-edge:#8b9099;--eda-pad-num:#1a140c;
    --eda-fcu:#e08a4a;--eda-bcu:#7fa8e0;--eda-silk-f:#c9ccd1;--eda-silk-b:#8b9099;
    --eda-fab:#8b9099;--eda-edge:#a992e0;
  }
}
