/* ═══════════════════════════════════════════════════════════
   CCD — Theme Engine
   Swappable accent palettes. Users can change / unlock themes.

   Every UI accent must reference these tokens (never hardcode):
     --ac        solid hero color
     --ac-rgb    "r,g,b" of hero  (use inside rgba(var(--ac-rgb), .15))
     --ac2       gradient end / secondary hero
     --ac2-rgb   "r,g,b" of ac2
     --ac-300    lighter hero (icons / emphasis text)
     --ac-200    lightest hero (body accent text)
     --ac-ink    readable text color when placed ON a solid --ac fill

   Legacy global tokens (--primary*, --accent, --border*) are remapped
   per-theme so untokenized components also shift with the theme.
═══════════════════════════════════════════════════════════ */

:root {
  /* default = Plasma (violet → fuchsia) */
  --ac: #8b5cf6;        --ac-rgb: 139,92,246;
  --ac2: #ec4899;       --ac2-rgb: 236,72,153;
  --ac-300: #a78bfa;    --ac-200: #c4b5fd;
  --ac-ink: #ffffff;
  --ac-grad: linear-gradient(135deg, var(--ac), var(--ac2));

  --primary: var(--ac);
  --primary-light: var(--ac-300);
  --primary-dark: #7c3aed;
  --accent: var(--ac2);
  --border: rgba(var(--ac-rgb), .16);
  --border-hover: rgba(var(--ac-rgb), .34);
  --glow: 0 0 24px rgba(var(--ac-rgb), .25);
}

/* ── FREE THEMES ─────────────────────────────────────────── */

/* Plasma — default identity */
[data-theme="plasma"] {
  --ac: #8b5cf6;        --ac-rgb: 139,92,246;
  --ac2: #ec4899;       --ac2-rgb: 236,72,153;
  --ac-300: #a78bfa;    --ac-200: #c4b5fd;   --ac-ink:#ffffff;
  --primary-dark:#7c3aed;
}

/* Indigo Classic — the original CCD look (revert option) */
[data-theme="indigo"] {
  --ac: #6366f1;        --ac-rgb: 99,102,241;
  --ac2: #8b5cf6;       --ac2-rgb: 139,92,246;
  --ac-300: #818cf8;    --ac-200: #a5b4fc;   --ac-ink:#ffffff;
  --primary-dark:#4f46e5;
}

/* Ion — electric teal → cyan */
[data-theme="ion"] {
  --ac: #2dd4bf;        --ac-rgb: 45,212,191;
  --ac2: #22d3ee;       --ac2-rgb: 34,211,238;
  --ac-300: #5eead4;    --ac-200: #99f6e4;   --ac-ink:#04201d;
  --primary-dark:#0d9488;
}

/* ── PREMIUM THEMES (unlockable) ─────────────────────────── */

/* Signal — chartreuse on graphite */
[data-theme="signal"] {
  --ac: #b6ff3c;        --ac-rgb: 182,255,60;
  --ac2: #5ee06b;       --ac2-rgb: 94,224,107;
  --ac-300: #caff6e;    --ac-200: #dbff9a;   --ac-ink:#0e1400;
  --primary-dark:#84cc16;
}

/* Ember — gold → coral */
[data-theme="ember"] {
  --ac: #ffb020;        --ac-rgb: 255,176,32;
  --ac2: #ff5e3a;       --ac2-rgb: 255,94,58;
  --ac-300: #ffc555;    --ac-200: #ffd98a;   --ac-ink:#2a1400;
  --primary-dark:#ea580c;
}

/* Crimson — red → rose */
[data-theme="crimson"] {
  --ac: #f43f5e;        --ac-rgb: 244,63,94;
  --ac2: #fb7185;       --ac2-rgb: 251,113,133;
  --ac-300: #fb7185;    --ac-200: #fda4af;   --ac-ink:#ffffff;
  --primary-dark:#e11d48;
}

/* Arctic — sky → indigo, cool minimal */
[data-theme="arctic"] {
  --ac: #38bdf8;        --ac-rgb: 56,189,248;
  --ac2: #818cf8;       --ac2-rgb: 129,140,248;
  --ac-300: #7dd3fc;    --ac-200: #bae6fd;   --ac-ink:#04222e;
  --primary-dark:#0284c7;
}

/* Mono — graphite/steel, ultra minimal */
[data-theme="mono"] {
  --ac: #94a3b8;        --ac-rgb: 148,163,184;
  --ac2: #e2e8f0;       --ac2-rgb: 226,232,240;
  --ac-300: #cbd5e1;    --ac-200: #e2e8f0;   --ac-ink:#0a0a0f;
  --primary-dark:#64748b;
}

/* Gold — luxe amber, premium */
[data-theme="gold"] {
  --ac: #eab308;        --ac-rgb: 234,179,8;
  --ac2: #fbbf24;       --ac2-rgb: 251,191,36;
  --ac-300: #facc15;    --ac-200: #fde68a;   --ac-ink:#241c00;
  --primary-dark:#ca8a04;
}

/* Sunset — pink → orange */
[data-theme="sunset"] {
  --ac: #f472b6;        --ac-rgb: 244,114,182;
  --ac2: #fb923c;       --ac2-rgb: 251,146,60;
  --ac-300: #f9a8d4;    --ac-200: #fbcfe8;   --ac-ink:#2a0a1a;
  --primary-dark:#db2777;
}

/* === CCD extended theme pack (auto-generated) === */
[data-theme="midnight"] {
  --ac: #1d4ed8;        --ac-rgb: 29,78,216;
  --ac2: #3b82f6;       --ac2-rgb: 59,130,246;
  --ac-300: #5c7fe2;    --ac-200: #92aaec;   --ac-ink:#ffffff;
}
[data-theme="aurora"] {
  --ac: #10b981;        --ac-rgb: 16,185,129;
  --ac2: #22d3ee;       --ac2-rgb: 34,211,238;
  --ac-300: #52cca4;    --ac-200: #8cddc2;   --ac-ink:#ffffff;
}
[data-theme="neon"] {
  --ac: #d946ef;        --ac-rgb: 217,70,239;
  --ac2: #22d3ee;       --ac2-rgb: 34,211,238;
  --ac-300: #e379f3;    --ac-200: #eca6f7;   --ac-ink:#ffffff;
}
[data-theme="rosegold"] {
  --ac: #fb7185;        --ac-rgb: 251,113,133;
  --ac2: #fbbf24;       --ac2-rgb: 251,191,36;
  --ac-300: #fc98a7;    --ac-200: #fdbac4;   --ac-ink:#ffffff;
}
[data-theme="cyber"] {
  --ac: #06b6d4;        --ac-rgb: 6,182,212;
  --ac2: #a855f7;       --ac2-rgb: 168,85,247;
  --ac-300: #4bcae0;    --ac-200: #87dbea;   --ac-ink:#ffffff;
}
[data-theme="lava"] {
  --ac: #f97316;        --ac-rgb: 249,115,22;
  --ac2: #dc2626;       --ac2-rgb: 220,38,38;
  --ac-300: #fa9a57;    --ac-200: #fcbb8f;   --ac-ink:#ffffff;
}
[data-theme="sapphire"] {
  --ac: #2563eb;        --ac-rgb: 37,99,235;
  --ac2: #4f46e5;       --ac2-rgb: 79,70,229;
  --ac-300: #628ef0;    --ac-200: #96b4f5;   --ac-ink:#ffffff;
}
[data-theme="coral"] {
  --ac: #ff7a59;        --ac-rgb: 255,122,89;
  --ac2: #ff4d8d;       --ac2-rgb: 255,77,141;
  --ac-300: #ff9f87;    --ac-200: #ffbfaf;   --ac-ink:#ffffff;
}
[data-theme="emerald"] {
  --ac: #059669;        --ac-rgb: 5,150,105;
  --ac2: #84cc16;       --ac2-rgb: 132,204,22;
  --ac-300: #4bb393;    --ac-200: #87ccb7;   --ac-ink:#ffffff;
}
[data-theme="flamingo"] {
  --ac: #ec4899;        --ac-rgb: 236,72,153;
  --ac2: #f97316;       --ac2-rgb: 249,115,22;
  --ac-300: #f17bb5;    --ac-200: #f5a7ce;   --ac-ink:#ffffff;
}
[data-theme="ocean"] {
  --ac: #0ea5e9;        --ac-rgb: 14,165,233;
  --ac2: #2dd4bf;       --ac2-rgb: 45,212,191;
  --ac-300: #51beef;    --ac-200: #8bd3f4;   --ac-ink:#ffffff;
}
[data-theme="amethyst"] {
  --ac: #8b5cf6;        --ac-rgb: 139,92,246;
  --ac2: #d946ef;       --ac2-rgb: 217,70,239;
  --ac-300: #ab89f8;    --ac-200: #c7b0fa;   --ac-ink:#ffffff;
}
[data-theme="inferno"] {
  --ac: #ef4444;        --ac-rgb: 239,68,68;
  --ac2: #f59e0b;       --ac2-rgb: 245,158,11;
  --ac-300: #f37878;    --ac-200: #f7a5a5;   --ac-ink:#ffffff;
}
[data-theme="jade"] {
  --ac: #14b8a6;        --ac-rgb: 20,184,166;
  --ac2: #4ade80;       --ac2-rgb: 74,222,128;
  --ac-300: #55cbbe;    --ac-200: #8edcd4;   --ac-ink:#ffffff;
}
[data-theme="dragonfruit"] {
  --ac: #f43f5e;        --ac-rgb: 244,63,94;
  --ac2: #a855f7;       --ac2-rgb: 168,85,247;
  --ac-300: #f7748b;    --ac-200: #f9a2b1;   --ac-ink:#ffffff;
}
[data-theme="tangerine"] {
  --ac: #fb923c;        --ac-rgb: 251,146,60;
  --ac2: #f59e0b;       --ac2-rgb: 245,158,11;
  --ac-300: #fcb072;    --ac-200: #fdcaa1;   --ac-ink:#0a0f0a;
}
[data-theme="ultraviolet"] {
  --ac: #6d28d9;        --ac-rgb: 109,40,217;
  --ac2: #2563eb;       --ac2-rgb: 37,99,235;
  --ac-300: #9564e3;    --ac-200: #b897ec;   --ac-ink:#ffffff;
}
[data-theme="blossom"] {
  --ac: #f472b6;        --ac-rgb: 244,114,182;
  --ac2: #c084fc;       --ac2-rgb: 192,132,252;
  --ac-300: #f799ca;    --ac-200: #f9bbdb;   --ac-ink:#ffffff;
}
[data-theme="solar"] {
  --ac: #facc15;        --ac-rgb: 250,204,21;
  --ac2: #fb923c;       --ac2-rgb: 251,146,60;
  --ac-300: #fbda56;    --ac-200: #fce68e;   --ac-ink:#0a0f0a;
}
[data-theme="steel"] {
  --ac: #64748b;        --ac-rgb: 100,116,139;
  --ac2: #94a3b8;       --ac2-rgb: 148,163,184;
  --ac-300: #8f9aab;    --ac-200: #b4bcc7;   --ac-ink:#ffffff;
}
[data-theme="limepunch"] {
  --ac: #a3e635;        --ac-rgb: 163,230,53;
  --ac2: #22c55e;       --ac2-rgb: 34,197,94;
  --ac-300: #bced6d;    --ac-200: #d2f39e;   --ac-ink:#0a0f0a;
}
[data-theme="cobalt"] {
  --ac: #3b82f6;        --ac-rgb: 59,130,246;
  --ac2: #6366f1;       --ac2-rgb: 99,102,241;
  --ac-300: #71a5f8;    --ac-200: #a0c3fa;   --ac-ink:#ffffff;
}