/* ─── Light mode tokens ─── */
:root,
.theme-system,
.theme-light {
  --color-bg-primary:     #e4dcc9;  /* richer warm beige — more earthy than the old cream */
  --color-bg-secondary:   #ece6d8;  /* slightly lighter surface for elevated elements */
  --color-bg-glass:       rgba(228, 220, 201, 0.55);
  --color-bg-glass-card:  rgba(228, 220, 201, 0.72);
  --color-text-primary:   #1c2e22;
  --color-text-secondary: #2e4639;
  --color-text-muted:     #5a7a64;
  --color-accent:         #2e4639;
  --color-accent-hover:   #1c2e22;
  --color-border:         rgba(28, 46, 34, 0.12);
  --color-shadow:         rgba(28, 46, 34, 0.08);
  --color-shadow-soft:    rgba(28, 46, 34, 0.06);
  --color-subsection-bg:  rgba(252, 249, 241, 0.24);
  --color-ghost:          rgba(28, 46, 34, 0.09);
  --color-ghost-strong:   oklch(from var(--color-bg-primary) calc(l * 0.55) c h / 0.22);
  --color-error:          oklch(42% 0.18 22);   /* deep crimson */
  --color-success:        oklch(42% 0.16 145);  /* deep green */
  --color-female:         oklch(52% 0.20 340);  /* deep pink */
  --color-male:           oklch(55% 0.10 225);  /* steel blue */
  --color-emphasis:           oklch(52% 0.14 55);   /* warm amber — derived from bg hue, prominent against green text */
  --eucalyptus-opacity:   0.90;  /* slightly more opaque — richer bg can carry a bit more branch weight */

  /* Content screen background */
  --content-bg-gradient: var(--color-bg-primary);

  /* Weather wedding day card — warm beige palette, slightly deeper than surroundings */
  --color-weather-wedding-bg:        oklch(80% 0.030 75);
  --color-weather-wedding-border:    oklch(68% 0.045 70);
  --color-weather-wedding-text:      oklch(93% 0.018 88);  /* near-white — for badge text on amber */
  --color-weather-wedding-muted:     oklch(38% 0.07 60);   /* warm dark — for abbr on warm beige card */
  --color-weather-wedding-badge:     oklch(72% 0.10 138);
  --color-weather-wedding-shadow:    oklch(55% 0.06 70 / 0.18);
  --color-weather-wedding-shadow-sm: oklch(55% 0.06 70 / 0.10);
  --color-weather-today-bg:          oklch(85% 0.03 88 / 0.65);
  --color-weather-rain-muted:        var(--color-text-muted);
  --color-weather-rain-active:       oklch(52% 0.09 225);
  --color-weather-snow-active:       oklch(65% 0.09 210);
  --color-weather-wind-calm:         var(--color-text-muted);
  --color-weather-wind-medium:       oklch(58% 0.13 80);
  --color-weather-wind-strong:       oklch(58% 0.16 38);
  --color-weather-sun-times:         var(--color-text-muted);
}

/* ─── System preference: dark ─── */
@media (prefers-color-scheme: dark) {
  .theme-system {
    --color-bg-primary:     #1c2e22;
    --color-bg-secondary:   #2e4639;
    --color-bg-glass:       rgba(28, 46, 34, 0.60); /* slightly more opaque — dark bg needs more glass body for legibility */
    --color-bg-glass-card:  rgba(247, 245, 238, 0.09); /* warm white at low opacity — blur+saturate creates frosted glass on dark foliage */
    --color-text-primary:   #f7f5ee;
    --color-text-secondary: #f1ece1;
    --color-text-muted:     #c8bfaa;
    --color-accent:         #f1ece1;
    --color-accent-hover:   #ffffff;
    --color-border:         rgba(247, 245, 238, 0.12);
    --color-shadow:         rgba(0, 0, 0, 0.25);
    --color-shadow-soft:    rgba(0, 0, 0, 0.08);
    --color-subsection-bg:  rgba(247, 245, 238, 0.04);
    --color-ghost:          rgba(247, 245, 238, 0.09);
    --color-ghost-strong:   oklch(from var(--color-bg-primary) calc(l * 0.4) c h / 0.28);
    --color-error:          oklch(80% 0.20 22);
    --color-success:        oklch(72% 0.18 145);  /* bright green */
    --color-female:         oklch(78% 0.18 340);  /* bright pink */
    --color-male:           oklch(76% 0.14 225);  /* bright steel blue */
    --color-emphasis:           oklch(72% 0.14 75);   /* champagne gold — lighter for dark bg */
    --eucalyptus-opacity:   0.72;

    --content-bg-gradient: var(--color-bg-primary);

    --color-weather-wedding-bg:        oklch(38% 0.11 155);
    --color-weather-wedding-border:    oklch(48% 0.13 155);
    --color-weather-wedding-text:      oklch(95% 0.015 88);
    --color-weather-wedding-muted:     oklch(86% 0.04 130);
    --color-weather-wedding-badge:     oklch(82% 0.10 138);
    --color-weather-wedding-shadow:    oklch(20% 0.10 155 / 0.18);
    --color-weather-wedding-shadow-sm: oklch(20% 0.10 155 / 0.12);
    --color-weather-today-bg:          oklch(30% 0.07 155 / 0.6);
    --color-weather-rain-muted:        var(--color-text-muted);
    --color-weather-rain-active:       oklch(67% 0.10 225);
    --color-weather-snow-active:       oklch(73% 0.09 210);
    --color-weather-wind-calm:         var(--color-text-muted);
    --color-weather-wind-medium:       oklch(72% 0.13 80);
    --color-weather-wind-strong:       oklch(72% 0.15 38);
    --color-weather-sun-times:         var(--color-text-muted);
  }
}

/* ─── Explicit dark override (ignores system preference) ─── */
.theme-dark {
  --color-bg-primary:     #1c2e22;
  --color-bg-secondary:   #2e4639;
  --color-bg-glass:       rgba(28, 46, 34, 0.60); /* slightly more opaque — dark bg needs more glass body for legibility */
  --color-bg-glass-card:  rgba(247, 245, 238, 0.09); /* warm white at low opacity — blur+saturate creates frosted glass on dark foliage */
  --color-text-primary:   #f7f5ee;
  --color-text-secondary: #f1ece1;
  --color-text-muted:     #c8bfaa;
  --color-accent:         #f1ece1;
  --color-accent-hover:   #ffffff;
  --color-border:         rgba(247, 245, 238, 0.12);
  --color-shadow:         rgba(0, 0, 0, 0.25);
  --color-shadow-soft:    rgba(0, 0, 0, 0.08);
  --color-ghost:          rgba(247, 245, 238, 0.09);
  --color-ghost-strong:   oklch(from var(--color-bg-primary) calc(l * 0.4) c h / 0.28);
  --color-error:          oklch(80% 0.20 22);
  --color-success:        oklch(72% 0.18 145);  /* bright green */
  --color-female:         oklch(78% 0.18 340);  /* bright pink */
  --color-emphasis:           oklch(72% 0.14 75);
  --eucalyptus-opacity:   0.72;

  --content-bg-gradient: var(--color-bg-primary);

  --color-weather-wedding-bg:        oklch(38% 0.11 155);
  --color-weather-wedding-border:    oklch(48% 0.13 155);
  --color-weather-wedding-text:      oklch(95% 0.015 88);
  --color-weather-wedding-muted:     oklch(86% 0.04 130);
  --color-weather-wedding-badge:     oklch(82% 0.10 138);
  --color-weather-wedding-shadow:    oklch(20% 0.10 155 / 0.18);
  --color-weather-wedding-shadow-sm: oklch(20% 0.10 155 / 0.12);
  --color-weather-today-bg:          oklch(30% 0.07 155 / 0.6);
  --color-weather-rain-muted:        var(--color-text-muted);
  --color-weather-rain-active:       oklch(67% 0.10 225);
  --color-weather-snow-active:       oklch(73% 0.09 210);
  --color-weather-wind-calm:         var(--color-text-muted);
  --color-weather-wind-medium:       oklch(72% 0.13 80);
  --color-weather-wind-strong:       oklch(72% 0.15 38);
  --color-weather-sun-times:         var(--color-text-muted);
}

/* ─── Apply background + text to body ─── */
body {
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  transition:
    background-color var(--transition-slow),
    color var(--transition-slow);
}