/* A Waste Project – colour theme. Every page reads its colours from here.
   Dark mode follows the visitor's system setting (prefers-color-scheme); there is no toggle.
   To try a new scheme, change --accent (buttons + stat accents) or --ink (header/hero black).
   The darker hover shade and light tint are derived from --accent automatically. */
:root {
  color-scheme:light dark;
  --accent:#257831;
  --ink:#000;

  /* fallbacks for browsers without color-mix() (pre-2023); keep in step with --accent */
  --accent-dark:#1d5f27;
  --tint:#eef6ef;

  --green:var(--accent); --green-dark:var(--accent-dark);   /* legacy names used by older pages */
  --header-bg:var(--ink); --bg:#fff; --card-bg:#fff;
  --text:#333; --text-strong:#222; --text-soft:#444; --heading:#111; --muted:#666;
  --border:#dde3de; --photo-bg:#e4ece5;
  --on-green:#fff; --on-dark:#fff; --on-dark-soft:#c9d2ca; --on-photo:#eef2ee;
  --section-alt:#f4f6f4; --rule-dark:#222;
  --live-bg:var(--accent); --live-text:#fff; --cancel:#8a8a8a; --cancel-bg:#f3f3f3;
  --link:var(--accent-dark);      /* green text: links, dates, eyebrows */
  --accent-text:var(--accent);    /* green numbers / list markers */
  --on-light:#111;                /* dark text on a white chip (skip link) */
  --badge-past:#444;
}
@supports (color: color-mix(in srgb, red, blue)) {
  :root {
    --accent-dark:color-mix(in srgb, var(--accent) 78%, #000);
    --tint:color-mix(in srgb, var(--accent) 8%, #fff);
  }
}

/* Dark mode: the header, hero, stats and footer are already black, so only the
   light content areas change. Buttons keep the brand green; green text gets a
   brighter shade so it stays readable (WCAG AA) on the dark background. */
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#121212; --card-bg:#1c1d1c; --section-alt:#181918;
    --text:#d4d7d4; --text-strong:#e4e6e4; --text-soft:#c2c6c2; --heading:#f3f4f3; --muted:#a0a5a0;
    --border:#333833; --photo-bg:#262a26; --rule-dark:#2a2a2a;
    --tint:#172a1b; --cancel:#8e8e8e; --cancel-bg:#1e1e1e; --badge-past:#555;
    --link:#6fcf7e; --accent-text:#6fcf7e;
  }
}
