/* ============================================================
   DUSTY CHAIN — COLOR TOKENS
   A premium gravel adventure brand. Palette drawn directly from
   the June 2026 Brand Direction: deep alpine teals, warm
   expedition gold, dusty off-whites and near-black inks.
   ============================================================ */
:root {
  /* ---- Brand primaries ---- */
  --dc-teal: #3A9E96;          /* bright alpine teal — accents, links, active */
  --dc-teal-deep: #1D6B65;     /* deep teal — primary brand surface / buttons */
  --dc-gold: #C9A96E;          /* expedition gold — highlights, badges, rules */
  --dc-night: #13111A;         /* night — deep display backgrounds */

  /* ---- Neutrals ---- */
  --dc-dust: #F5F0E8;          /* dust — default warm page background */
  --dc-offwhite: #FAF8F4;      /* warm off-white — cards / raised surfaces */
  --dc-gravel: #7A6E60;        /* gravel — body text on light, muted labels */
  --dc-ink: #1A1714;           /* ink — headings / near-black text */

  /* ---- Tints & shades (derived, harmonious) ---- */
  --dc-teal-deeper: #14504B;   /* pressed / darkest teal */
  --dc-teal-tint: #E4EFED;     /* faint teal wash — hover fills, chips */
  --dc-gold-deep: #A8884E;     /* gold pressed / gold text on light */
  --dc-gold-tint: #F1E7D4;     /* faint gold wash */
  --dc-dust-shade: #E8E0D2;    /* dust border / divider on light */
  --dc-gravel-light: #A99E90;  /* disabled text, faint captions */
  --dc-night-800: #201C28;     /* raised surface on night backgrounds */

  /* ============================================================
     SEMANTIC ALIASES — reference these in components.
     ============================================================ */
  /* Backgrounds & surfaces */
  --surface-page: var(--dc-dust);
  --surface-card: var(--dc-offwhite);
  --surface-raised: #FFFFFF;
  --surface-sunken: var(--dc-dust-shade);
  --surface-brand: var(--dc-teal-deep);
  --surface-night: var(--dc-night);
  --surface-night-raised: var(--dc-night-800);

  /* Text */
  --text-heading: var(--dc-ink);
  --text-body: var(--dc-gravel);
  --text-muted: var(--dc-gravel-light);
  --text-on-brand: var(--dc-offwhite);
  --text-on-night: var(--dc-dust);
  --text-link: var(--dc-teal-deep);
  --text-gold: var(--dc-gold-deep);

  /* Lines */
  --border-subtle: var(--dc-dust-shade);
  --border-strong: var(--dc-gravel);
  --border-brand: var(--dc-teal-deep);
  --rule-gold: var(--dc-gold);

  /* Interactive accents */
  --accent: var(--dc-teal-deep);
  --accent-hover: var(--dc-teal-deeper);
  --accent-bright: var(--dc-teal);
  --highlight: var(--dc-gold);

  /* ---- Feedback / status ---- */
  --status-success: #3F8F5B;
  --status-warning: var(--dc-gold-deep);
  --status-danger: #B4472F;   /* clay red — sits inside the earthy palette */
  --status-info: var(--dc-teal);
}