/**
 * ============================================================
 * THREADS & TOGS — Design Tokens (PUBLIC SITE)
 * ============================================================
 * THE single source of truth for the customer-facing site.
 *
 * Previously this file held the old dark palette and was not
 * linked by any page — every page carried its own inline
 * :root instead, which had drifted apart (index.html used
 * --surface2/--danger/--success, the /pages/ files used
 * --surface-2/--red/--green, and --gold-dark held two
 * different colours). Those inline blocks are now removed and
 * every public page links this file.
 *
 * Both naming conventions are kept as aliases on purpose, so
 * no existing rule had to be rewritten.
 *
 * Do NOT re-add a :root block to a page. Add it here.
 * ============================================================
 */

:root {
  /* ── Brand palette — premium light / ivory ───────────────── */
  --black:       #FBF7F0;   /* page background — warm ivory      */
  --white:       #2B2A27;   /* primary text — charcoal           */
  --gold:        #9C7A1F;   /* antique gold — CTAs, accents      */
  --gold-light:  #C9A84C;   /* lighter gold highlights           */
  --gold-dark:   #C9A84C;   /* gradient/active partner to --gold
                               NOTE: intentionally the lighter
                               gold. It is used as a BACKGROUND
                               behind var(--white) charcoal text
                               (.cal-day.return, .co-step.done).
                               The old #7A5E14 on index.html put
                               charcoal on deep brown-gold, which
                               was unreadable.                   */
  --gold-deep:   #7A5E14;   /* deep gold — borders/hover only,
                               never behind charcoal text        */
  --gold-dim:    #9C7A1F14; /* 8% gold wash                      */

  --surface:     #FFFFFF;   /* cards                             */
  --surface-2:   #F3EDE1;   /* alternate sections                */
  --surface2:    #F3EDE1;   /* alias — index.html spelling       */
  --border:      #E6DCC9;   /* soft warm border                  */
  --border-2:    #DCCFB8;   /* stronger border                   */
  --text-muted:  #8A8177;   /* secondary text                    */

  /* ── Semantic ────────────────────────────────────────────── */
  --danger:      #B23A2E;
  --red:         #B23A2E;   /* alias — /pages/ spelling          */
  --success:     #2E7D4F;
  --green:       #2E7D4F;   /* alias — /pages/ spelling          */
  --warning:     #B8860B;
  --info:        #2E5F8A;
  --star:        #E8A33D;

  /* ── Navigation surface (used by initNavScroll) ──────────── */
  --nav-bg:        rgba(251, 247, 240, 0.92);
  --nav-bg-scroll: rgba(251, 247, 240, 0.98);

  /* ── Typography ──────────────────────────────────────────── */
  --font-display: 'Cormorant Garamond', serif;
  --font-heading: 'Bebas Neue', sans-serif;
  --font-body:    'DM Sans', sans-serif;

  /* ── Spacing scale ───────────────────────────────────────── */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  48px;
  --space-2xl: 80px;
  --space-3xl: 100px;

  /* ── Border radius ───────────────────────────────────────── */
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;

  /* ── Transitions ─────────────────────────────────────────── */
  --transition-fast:   0.15s ease;
  --transition-normal: 0.3s ease;
  --transition-slow:   0.5s ease;

  /* ── Minimum comfortable tap target (mobile) ─────────────── */
  --tap: 44px;

  /* ── Z-index scale ───────────────────────────────────────── */
  --z-nav:       1000;
  --z-drawer:    9997;
  --z-cart:      9998;
  --z-modal:     9999;
  --z-checkout: 10000;
  --z-auth:     10001;
  --z-toast:    99999;
}

/* ── Responsive breakpoints (for reference) ──────────────────
   xs:  < 480px   (small mobile)
   sm:  480–600px (mobile)
   md:  600–900px (tablet)
   lg:  900–1024px (small desktop)
   xl:  > 1024px  (desktop)
   ─────────────────────────────────────────────────────────── */