/* SevenGrid — shared theme tokens for sevengrid.app.
 * Used by index.html and all 4 legal pages. Source of truth.
 * Aurora (dark) + Daylight (light) are the two Free themes; Pine/Atlas/Ember/Forge/Midnight/Plum/Mocha are Pro.
 * Habit-color presets (theme-independent) live here too — referenced
 * via inline style="--c:var(--habit-X)" in demo-grid rows + swatches.
 */

:root {
  /* Habit-color presets — user-chosen, stay constant across themes.
     Canonical source: app/constants/colors.json (.habit). 16 presets total. */
  --habit-coral:   #F97316;
  --habit-amber:   #F59E0B;
  --habit-yellow:  #EAB308;
  --habit-lime:    #84CC16;
  --habit-mint:    #10B981;
  --habit-teal:    #14B8B4;
  --habit-cyan:    #06B6D4;
  --habit-sky:     #0EA5E9;
  --habit-blue:    #3B82F6;
  --habit-indigo:  #6366F1;
  --habit-violet:  #A855F7;
  --habit-fuchsia: #D946EF;
  --habit-pink:    #EC4899;
  --habit-rose:    #F43F5E;
  --habit-slate:   #64748B;
  --habit-stone:   #A8A29E;
}

/* THEMES — chrome only. Habit-color cells stay theme-independent. */

:root[data-theme="aurora"], :root:not([data-theme]) {
  --bg-primary: #0A0F12;
  --bg-surface: #11181D;
  --bg-elevated: #1A2228;
  --border:     #2A3338;
  --text-primary: #F5F7F8;
  --text-muted:   #8B9499;
  --text-faint:   #6B7378;
  --action:       #1DC7B7;
  --accent-deep:  #0A6E68;
  --celebration:  #22C55E;
  --premium:      #ECDFC8;
  --check-stroke: #ECDFC8;
}

/* Daylight — the only LIGHT theme + the second Free theme (v1.1, ADR 0010).
   Warm paper-white bg, deepened teal action for contrast on light, dark-gold
   premium (cream is invisible on light). Tokens 1:1 with app/constants/themes.ts
   EXCEPT --text-faint: the app's #9B9E9F is ~2.5:1 (fails WCAG-AA), so the web
   variant is darkened to #676A66 — ~4.8:1 on --bg-surface (the demo-grid card,
   where the day-labels + KW badge live). Same web-vs-app text-faint divergence
   the dark themes use, inverted.
   KNOWN (app-owned, ADR 0010 + pending device-QA): on the tinted --bg-surface/
   --bg-elevated, the app's --action (#0C8074 → 4.2/3.9:1) and --celebration
   (#15A34A → 2.9/2.6:1) dip below AA for small text (today day-label, the CTAs,
   the streak flame). Left at app values on purpose — re-tuning brand chrome
   only here would drift from the app; the fix belongs in the app palette and
   propagates back. action on --bg-primary (4.6:1) + all primary-bg text pass. */
:root[data-theme="daylight"] {
  --bg-primary: #FBFAF7;
  --bg-surface: #F2F0EA;
  --bg-elevated: #E9E6DD;
  --border:     #D7D3C8;
  --text-primary: #1A1C1E;
  --text-muted:   #5C6063;
  --text-faint:   #676A66;
  --action:       #0C8074;
  --accent-deep:  #064A43;
  --celebration:  #15A34A;
  --premium:      #7A5F10;
  --check-stroke: #ECDFC8;
}

:root[data-theme="pine"] {
  --bg-primary: #0C1611;
  --bg-surface: #14201A;
  --bg-elevated: #1C2922;
  --border:     #2E3C34;
  --text-primary: #F0EFE8;
  --text-muted:   #8B9387;
  --text-faint:   #6E7672;
  --action:       #5BA66E;
  --accent-deep:  #2C4A39;
  --celebration:  #D4AF37;
  --premium:      #ECDFC8;
  --check-stroke: #ECDFC8;
}

:root[data-theme="atlas"] {
  --bg-primary: #0A1418;
  --bg-surface: #131F25;
  --bg-elevated: #1B2A33;
  --border:     #2C3C46;
  --text-primary: #ECEFF2;
  --text-muted:   #8A95A0;
  --text-faint:   #6C7580;
  --action:       #5B95B5;
  --accent-deep:  #2D4A6B;
  --celebration:  #B08D57;
  --premium:      #ECDFC8;
  --check-stroke: #ECDFC8;
}

:root[data-theme="ember"] {
  --bg-primary: #0F1014;
  --bg-surface: #15171B;
  --bg-elevated: #1C1E23;
  --border:     #2A2D33;
  --text-primary: #F0EFEC;
  --text-muted:   #8A8985;
  --text-faint:   #6A6964;
  --action:       #D4AF37;
  --accent-deep:  #7A6428;
  --celebration:  #D4AF37;
  --premium:      #ECDFC8;
  --check-stroke: #ECDFC8;
}

/* Forge — the home-team theme. Built on the canonical ByteSide brand tokens
   (Deep Navy + Signature Orange + Dark Teal + Mac-traffic-light success). */
:root[data-theme="forge"] {
  --bg-primary: #06171E;
  --bg-surface: #0F1F26;
  --bg-elevated: #14262E;
  --border:     #2A3D46;
  --text-primary: #E8EEF1;
  --text-muted:   #9AA8AE;
  --text-faint:   #788C92;
  --action:       #FD7D00;
  --accent-deep:  #015351;
  --celebration:  #27CA40;
  --premium:      #ECDFC8;
  --check-stroke: #ECDFC8;
}

/* Midnight — true-black AMOLED, OLED-quiet (Pro, added 2026-05-23). */
:root[data-theme="midnight"] {
  --bg-primary: #000000;
  --bg-surface: #0A0A0A;
  --bg-elevated: #141414;
  --border:     #1F1F1F;
  --text-primary: #EDEDED;
  --text-muted:   #8A8A8A;
  --text-faint:   #4A4A4A;
  --action:       #A5B4FC;
  --accent-deep:  #4F46E5;
  --celebration:  #34D399;
  --premium:      #ECDFC8;
  --check-stroke: #ECDFC8;
}

/* Plum — wine-dark, quietly creative (Pro, added 2026-05-23). */
:root[data-theme="plum"] {
  --bg-primary: #150D14;
  --bg-surface: #1E1421;
  --bg-elevated: #291828;
  --border:     #3A2A39;
  --text-primary: #F2EAEF;
  --text-muted:   #998796;
  --text-faint:   #5A4759;
  --action:       #C084FC;
  --accent-deep:  #7E22CE;
  --celebration:  #22C55E;
  --premium:      #ECDFC8;
  --check-stroke: #ECDFC8;
}

/* Mocha — roasted, grounded warmth (Pro, added 2026-05-23). */
:root[data-theme="mocha"] {
  --bg-primary: #15110D;
  --bg-surface: #1E1812;
  --bg-elevated: #2A2118;
  --border:     #3A2F22;
  --text-primary: #F1ECE2;
  --text-muted:   #9A8E7E;
  --text-faint:   #5A5040;
  --action:       #B5876F;
  --accent-deep:  #6B4423;
  --celebration:  #FB923C;
  --premium:      #ECDFC8;
  --check-stroke: #ECDFC8;
}
