/* PIP-OS theme definitions */

/* Categorical chart palette — validated (CVD-safe, contrast-checked) against
   each theme's own surface via the dataviz skill's validator. WHITE/GREEN/AMBER
   share the dark-surface steps (their --bg is always near-black); PAPER uses
   the light-surface steps since its --bg is a light cream. Slot order is the
   CVD-safety mechanism — never reorder or cycle past 8 without re-validating. */
:root[data-theme="WHITE"], :root[data-theme="GREEN"], :root[data-theme="AMBER"] {
  --series-1: #3987e5; /* blue */
  --series-2: #008300; /* green */
  --series-3: #d55181; /* magenta */
  --series-4: #c98500; /* yellow */
  --series-5: #199e70; /* aqua */
  --series-6: #d95926; /* orange */
  --series-7: #9085e9; /* violet */
  --series-8: #e66767; /* red */
}
:root[data-theme="PAPER"] {
  --series-1: #2a78d6;
  --series-2: #008300;
  --series-3: #e87ba4;
  --series-4: #eda100;
  --series-5: #1baf7a;
  --series-6: #eb6834;
  --series-7: #4a3aa7;
  --series-8: #e34948;
}

:root[data-theme="WHITE"] {
  --bg: #000000;
  --fg: #f2f2f2;
  --dim: #8a8a8a;
  --bright: #ffffff;
  --accent: #f2f2f2;
  --border: #4a4a4a;
  --invert-bg: #f2f2f2;
  --invert-fg: #000000;
  --glow: rgba(242,242,242,0.15);
  --glow-strong: rgba(242,242,242,0.35);
}

:root[data-theme="GREEN"] {
  --bg: #001500;
  --fg: #16e06b;
  --dim: #0a7a3a;
  --bright: #5fffaa;
  --accent: #16e06b;
  --border: #0a4a25;
  --invert-bg: #16e06b;
  --invert-fg: #001500;
  --glow: rgba(22,224,107,0.15);
  --glow-strong: rgba(22,224,107,0.4);
}

:root[data-theme="AMBER"] {
  --bg: #100a00;
  --fg: #ffb000;
  --dim: #7a5500;
  --bright: #ffd060;
  --accent: #ffb000;
  --border: #4a3000;
  --invert-bg: #ffb000;
  --invert-fg: #100a00;
  --glow: rgba(255,176,0,0.15);
  --glow-strong: rgba(255,176,0,0.4);
}

:root[data-theme="PAPER"] {
  color-scheme: light;
  --bg: #f0ede4;
  --fg: #1a1a1a;
  --dim: #6b6b6b;
  --bright: #000000;
  --accent: #1a1a1a;
  --border: #c0b8a0;
  --invert-bg: #1a1a1a;
  --invert-fg: #f0ede4;
  --glow: rgba(0,0,0,0.1);
  --glow-strong: rgba(0,0,0,0.2);
}

/* Apply theme colors to body background */
html, body { background: var(--bg) !important; }
