/* ============================================================
   Hili — Colour tokens
   "Earthy tones with vibrant accents."
   Backgrounds lean on the primary earthy + grey colours;
   secondary colours are accents or section/chapter breaks.
   ============================================================ */

:root {
  /* ---- Primary palette: earthy + neutral ---- */
  --hili-pale-grey: #F7F2F0;   /* lightest surface */
  --hili-light-grey: #EEE8E5;  /* subtle surface / borders */
  --hili-mid-grey: #D0C7C2;    /* dividers, muted strokes */
  --hili-stone: #89786F;       /* muted text, secondary ink */
  --hili-brown: #492824;       /* primary brand brown / ink */
  --hili-brown-logo: #4D2C29;  /* logo-specific warm brown */
  --hili-dark: #282828;        /* near-black ink */

  /* ---- Secondary palette: vibrant accents ---- */
  --hili-burnt-orange: #B94919;
  --hili-light-pink: #FFCABE;
  --hili-caramel: #C99547;
  --hili-light-yellow: #FCEED8;
  --hili-night-sky: #2C2248;   /* deep indigo (a.k.a. "Blue" in the palette) */
  --hili-light-blue: #D5E1FE;
  --hili-white: #FFFFFF;

  /* ---- Semantic aliases ---- */
  /* Text */
  --text-primary: var(--hili-brown);     /* default ink on light surfaces */
  --text-strong: var(--hili-dark);       /* maximum-contrast ink */
  --text-muted: var(--hili-stone);       /* secondary / supporting copy */
  --text-on-dark: var(--hili-pale-grey); /* ink on dark surfaces */
  --text-accent: var(--hili-burnt-orange);

  /* Surfaces */
  --surface-page: var(--hili-pale-grey);   /* default page background */
  --surface-card: var(--hili-white);       /* raised cards */
  --surface-sunken: var(--hili-light-grey); /* recessed wells */
  --surface-dark: var(--hili-brown);        /* dark sections */
  --surface-night: var(--hili-night-sky);   /* deepest dark sections */
  --surface-accent-warm: var(--hili-light-yellow);
  --surface-accent-pink: var(--hili-light-pink);
  --surface-accent-blue: var(--hili-light-blue);

  /* Lines & borders */
  --border-subtle: var(--hili-light-grey);
  --border-default: var(--hili-mid-grey);
  --border-strong: var(--hili-stone);

  /* Interactive */
  --accent: var(--hili-burnt-orange);
  --accent-hover: #9E3D13;        /* burnt orange, darkened ~8% */
  --accent-pressed: #842F0C;
  --accent-soft: var(--hili-light-pink);
  --focus-ring: var(--hili-night-sky);

  /* Status (derived from palette, kept warm) */
  --status-positive: #5E7A52;     /* sage, harmonised with earth tones */
  --status-warning: var(--hili-caramel);
  --status-critical: var(--hili-burnt-orange);
  --status-info: var(--hili-night-sky);

  /* ---- Extended-palette tints (solid — NO gradients) ----
     Per brand direction, Hili does not use gradients. The extended
     range for illustration/contrast is built from SOLID tints of the
     warm palette (mix toward pale grey). Use these as flat fills. */
  --tint-brown-75: color-mix(in srgb, var(--hili-brown) 75%, var(--hili-pale-grey));
  --tint-brown-50: color-mix(in srgb, var(--hili-brown) 50%, var(--hili-pale-grey));
  --tint-brown-25: color-mix(in srgb, var(--hili-brown) 25%, var(--hili-pale-grey));
  --tint-orange-75: color-mix(in srgb, var(--hili-burnt-orange) 75%, var(--hili-pale-grey));
  --tint-orange-50: color-mix(in srgb, var(--hili-burnt-orange) 50%, var(--hili-pale-grey));
  --tint-orange-25: color-mix(in srgb, var(--hili-burnt-orange) 25%, var(--hili-pale-grey));
  --tint-caramel-50: color-mix(in srgb, var(--hili-caramel) 50%, var(--hili-pale-grey));
  --tint-caramel-25: color-mix(in srgb, var(--hili-caramel) 25%, var(--hili-pale-grey));
}