/* ═══════════════════════════════════════════════════════════
   MOODY TEAS THEME SYSTEM
   Brand colors: Sage #7D988E | Steel Teal #65777e | Deep Forest #015500
   Warm Tan #A39882 | Off-white #fdfdfd | Dark Forest #1a2420
═══════════════════════════════════════════════════════════ */

/* ── Dark theme (default) ── */
:root,
[data-theme="dark"] {
  --bg:        #1a2420;
  --bg2:       #212e29;
  --bg3:       #273530;
  --bg4:       #2d3d38;
  --ink:       #fdfdfd;
  --ink2:      rgba(253,253,253,.75);
  --muted:     #7D988E;
  --border:    rgba(101,119,126,.22);
  --border2:   rgba(101,119,126,.12);
  --sage:      #7D988E;
  --teal:      #65777e;
  --forest:    #015500;
  --tan:       #A39882;
  --cream:     #fdfdfd;
  --success:   #6fcf6f;
  --success-bg: rgba(1,85,0,.3);
  --danger:    #fca5a5;
  --danger-bg: rgba(239,68,68,.2);
  --shadow:    0 8px 32px rgba(0,0,0,.4);
  --shadow-sm: 0 2px 8px rgba(0,0,0,.3);
  /* Hero overlay */
  --hero-overlay: linear-gradient(to bottom, transparent 30%, rgba(26,36,32,.85) 100%);
  /* Loyalty card */
  --loyalty-bg: linear-gradient(135deg, #273530 0%, #1e3028 100%);
  --loyalty-glow: rgba(125,152,142,.1);
  /* Community card */
  --community-border: rgba(163,152,130,.2);
  /* Market banner */
  --market-bg: linear-gradient(135deg, rgba(1,85,0,.3), rgba(1,85,0,.15));
  --market-border: rgba(1,85,0,.4);
}

/* ── Light theme ── */
[data-theme="light"] {
  --bg:        #f5f2ed;
  --bg2:       #fdfdfd;
  --bg3:       #ede9e3;
  --bg4:       #e4dfd7;
  --ink:       #1a2420;
  --ink2:      rgba(26,36,32,.7);
  --muted:     #65777e;
  --border:    rgba(101,119,126,.2);
  --border2:   rgba(101,119,126,.1);
  --sage:      #5a7a70;
  --teal:      #4a6068;
  --forest:    #015500;
  --tan:       #7a6a54;
  --cream:     #1a2420;
  --success:   #2d7a2d;
  --success-bg: rgba(1,85,0,.12);
  --danger:    #c0392b;
  --danger-bg: rgba(239,68,68,.1);
  --shadow:    0 8px 32px rgba(26,36,32,.12);
  --shadow-sm: 0 2px 8px rgba(26,36,32,.08);
  --hero-overlay: linear-gradient(to bottom, transparent 30%, rgba(245,242,237,.85) 100%);
  --loyalty-bg: linear-gradient(135deg, #e8e3db 0%, #ddd7ce 100%);
  --loyalty-glow: rgba(90,122,112,.08);
  --community-border: rgba(122,106,84,.2);
  --market-bg: linear-gradient(135deg, rgba(1,85,0,.08), rgba(1,85,0,.04));
  --market-border: rgba(1,85,0,.25);
}

/* ── Auto (system preference) ── */
@media (prefers-color-scheme: light) {
  [data-theme="auto"] {
    --bg:        #f5f2ed;
    --bg2:       #fdfdfd;
    --bg3:       #ede9e3;
    --bg4:       #e4dfd7;
    --ink:       #1a2420;
    --ink2:      rgba(26,36,32,.7);
    --muted:     #65777e;
    --border:    rgba(101,119,126,.2);
    --border2:   rgba(101,119,126,.1);
    --sage:      #5a7a70;
    --teal:      #4a6068;
    --forest:    #015500;
    --tan:       #7a6a54;
    --cream:     #1a2420;
    --success:   #2d7a2d;
    --success-bg: rgba(1,85,0,.12);
    --danger:    #c0392b;
    --danger-bg: rgba(239,68,68,.1);
    --shadow:    0 8px 32px rgba(26,36,32,.12);
    --shadow-sm: 0 2px 8px rgba(26,36,32,.08);
    --hero-overlay: linear-gradient(to bottom, transparent 30%, rgba(245,242,237,.85) 100%);
    --loyalty-bg: linear-gradient(135deg, #e8e3db 0%, #ddd7ce 100%);
    --loyalty-glow: rgba(90,122,112,.08);
    --community-border: rgba(122,106,84,.2);
    --market-bg: linear-gradient(135deg, rgba(1,85,0,.08), rgba(1,85,0,.04));
    --market-border: rgba(1,85,0,.25);
  }
}