/* ============================================================
   GOPHY — Color  (authoritative: design-tokens.json / src/index.css)
   "Stickers and stationery on a warm paper desk."
   The shipped app uses the Tailwind v3 + shadcn HSL convention:
   each token is a bare "H S% L%" triple consumed as
   hsl(var(--token)). We expose BOTH:
     --<token>      → the raw "H S% L%" triple (Tailwind-compatible)
     --c-<token>    → a ready-to-use hsl() value for plain CSS
   ============================================================ */

:root {
  /* ---------- shadcn core (raw triples — consumed via hsl(var(--x))) ---------- */
  --background:             35 20% 98%;     /* @kind color */ /* warm cream paper */
  --foreground:             0 0% 10%;       /* @kind color */
  --card:                   0 0% 100%;      /* @kind color */ /* pure white card */
  --card-foreground:        0 0% 10%;       /* @kind color */
  --popover:                0 0% 100%;      /* @kind color */
  --popover-foreground:     0 0% 10%;       /* @kind color */
  --primary:                12 85% 60%;     /* @kind color */ /* warm coral — CTAs */
  --primary-foreground:     0 0% 100%;      /* @kind color */
  --secondary:              35 100% 95%;    /* @kind color */ /* light peach */
  --secondary-foreground:   12 85% 40%;     /* @kind color */
  --muted:                  35 30% 92%;     /* @kind color */ /* disabled */
  --muted-foreground:       0 0% 45%;       /* @kind color */
  --accent:                 40 90% 65%;     /* @kind color */ /* golden yellow */
  --accent-foreground:      0 0% 20%;       /* @kind color */
  --destructive:            0 84.2% 60.2%;  /* @kind color */ /* errors / overdue */
  --destructive-foreground: 0 0% 98%;       /* @kind color */
  --border:                 35 30% 88%;     /* @kind color */ /* hairline strokes */
  --input:                  35 30% 88%;     /* @kind color */
  --ring:                   12 85% 60%;     /* @kind color */

  /* ---------- task palette (task-card backgrounds, raw triples) ---------- */
  --task-coral:        6 78% 70%;    /* @kind color */
  --task-coral-light:  6 78% 85%;    /* @kind color */
  --task-peach:        18 90% 75%;   /* @kind color */
  --task-yellow:       42 95% 75%;   /* @kind color */
  --task-green:        142 60% 70%;  /* @kind color */

  /* ---------- ready-to-use hsl() aliases ---------- */
  --c-background:           hsl(var(--background));
  --c-foreground:           hsl(var(--foreground));
  --c-card:                 hsl(var(--card));
  --c-primary:              hsl(var(--primary));
  --c-primary-foreground:   hsl(var(--primary-foreground));
  --c-secondary:            hsl(var(--secondary));
  --c-secondary-foreground: hsl(var(--secondary-foreground));
  --c-muted:                hsl(var(--muted));
  --c-muted-foreground:     hsl(var(--muted-foreground));
  --c-accent:               hsl(var(--accent));
  --c-accent-foreground:    hsl(var(--accent-foreground));
  --c-destructive:          hsl(var(--destructive));
  --c-border:               hsl(var(--border));

  --c-task-coral:        hsl(var(--task-coral));
  --c-task-coral-light:  hsl(var(--task-coral-light));
  --c-task-peach:        hsl(var(--task-peach));
  --c-task-yellow:       hsl(var(--task-yellow));
  --c-task-green:        hsl(var(--task-green));

  /* The 9-swatch custom-card palette already used in the app
     (assets/ui/color-options) — sampled from the PNGs. */
  --swatch-coral:      hsl(8 80% 67%);
  --swatch-orange:     hsl(28 90% 62%);
  --swatch-yellow:     hsl(45 92% 62%);
  --swatch-green:      hsl(152 45% 64%);
  --swatch-green-dark: hsl(82 22% 54%);
  --swatch-blue:       hsl(217 68% 64%);
  --swatch-blue-dark:  hsl(204 32% 47%);
  --swatch-purple:     hsl(280 35% 62%);
  --swatch-pink:       hsl(330 70% 70%);
  --swatch-grey:       hsl(0 0% 80%);

  /* ---------- semantic aliases ---------- */
  --text-body:       var(--c-foreground);
  --text-muted:      var(--c-muted-foreground);
  --surface-page:    var(--c-background);
  --surface-card:    var(--c-card);
  --reward:          var(--c-accent);   /* FamCoin gold */
  --state-overdue:   var(--c-destructive);
}