/* themes.css — Patrimoine theme palettes.
   Each [data-theme="…"] block defines surface/hairline/neon/shadow tokens
   plus --accent-rgb (R,G,B triple of the primary accent so app.css can
   compose translucent layers via rgb(var(--accent-rgb) / α)).

   To add a theme:
   1. Pick an id (kebab-case) and append a new [data-theme="<id>"] block below.
   2. Provide all 10 tokens used by the others: --surface, --surface-2,
      --hairline, --neon-purple, --neon-purple-soft, --neon-green, --neon-red,
      --neon-cyan, --shadow-glow, --accent-rgb.
   3. Register the id in /js/theme.mjs THEMES (label + 4-color swatch). The
      Settings → Apparence picker auto-renders it. */

[data-theme="pure-purple"] {
  --surface:          #0A0A0F;
  --surface-2:        #111119;
  --hairline:         rgba(177, 76, 255, 0.10);
  --neon-purple:      #B14CFF;
  --neon-purple-soft: #D08FFF;
  --neon-green:       #3DFFA0;
  --neon-red:         #FF3366;
  --neon-cyan:        #5BC8FF;
  --shadow-glow:      0 0 24px rgba(177, 76, 255, 0.28);
  --accent-rgb:       177, 76, 255;
  --neon-green-rgb:   61, 255, 160;
  --neon-red-rgb:     255, 51, 102;
}

[data-theme="cyber-mint"] {
  --surface:          #07100F;
  --surface-2:        #0D1A18;
  --hairline:         rgba(0, 230, 180, 0.10);
  --neon-purple:      #00E6B4;
  --neon-purple-soft: #5FFFD9;
  --neon-green:       #A3FF00;
  --neon-red:         #FF4455;
  --neon-cyan:        #00C8FF;
  --shadow-glow:      0 0 24px rgba(0, 230, 180, 0.24);
  --accent-rgb:       0, 230, 180;
  --neon-green-rgb:   163, 255, 0;
  --neon-red-rgb:     255, 68, 85;
}

[data-theme="synthwave"] {
  --surface:          #0D080F;
  --surface-2:        #150D1C;
  --hairline:         rgba(255, 113, 220, 0.12);
  --neon-purple:      #FF71DC;
  --neon-purple-soft: #FFB3EA;
  --neon-green:       #FFC857;
  --neon-red:         #6BB6FF;
  --neon-cyan:        #71F4FF;
  --shadow-glow:      0 0 24px rgba(255, 113, 220, 0.30);
  --accent-rgb:       255, 113, 220;
  --neon-green-rgb:   255, 200, 87;
  --neon-red-rgb:     107, 182, 255;
}

[data-theme="acid-lime"] {
  --surface:          #090B07;
  --surface-2:        #101408;
  --hairline:         rgba(180, 255, 0, 0.09);
  --neon-purple:      #B4FF00;
  --neon-purple-soft: #D4FF66;
  --neon-green:       #B4FF00;
  --neon-red:         #FF1F80;
  --neon-cyan:        #00EEFF;
  --shadow-glow:      0 0 24px rgba(180, 255, 0, 0.22);
  --accent-rgb:       180, 255, 0;
  --neon-green-rgb:   180, 255, 0;
  --neon-red-rgb:     255, 31, 128;
}