/* ==========================================================================
   GigGuide — Design tokens
   Source of truth for colour, type, spacing, radius, elevation and motion.
   Extracted from "GigGuide AU v17.dc.html" (hi-fi reference).
   ========================================================================== */


:root {
  color-scheme: dark;

  /* ---- Surfaces (dark, neutral) ---------------------------------------- */
  --gg-bg:            #0B0B0B;  /* page */
  --gg-bg-hero:       #121212;  /* hero bands, sheets */
  --gg-surface:       #1E1E1E;  /* cards, inputs, chips (rest) */
  --gg-surface-2:     #262626;  /* card hover */
  --gg-surface-3:     #2A2A2A;  /* fields, raised chips, hover of surface */
  --gg-surface-4:     #343434;  /* hover of surface-3 */
  --gg-border:        #2E2E2E;  /* hairlines, card borders */
  --gg-border-strong: #3A3A3A;  /* chip borders, input outlines */

  /* ---- Text ------------------------------------------------------------- */
  --gg-text:          #FFFFFF;  /* headlines, act names */
  --gg-text-1:        #EDEDED;  /* primary body / labels */
  --gg-text-2:        #CFCFCF;  /* secondary */
  --gg-text-3:        #9A9A9A;  /* meta, captions (min for AA on #0B0B0B) */
  --gg-text-4:        #8A8A8A;  /* placeholders, inactive nav */
  --gg-text-disabled: #4A4A4A;
  --gg-on-light:      #0A0A0A;  /* text on white buttons */

  /* ---- Brand / semantic ------------------------------------------------- */
  --gg-primary:        #FFFFFF; /* primary CTA fill (Find gigs, Tickets, List your event) */
  --gg-primary-hover:  #E4E4E4;
  --gg-primary-active: #D6D6D6;
  --gg-link:           #83A2B6; /* text links, "Clear", secondary actions */
  --gg-success:        #78B29C; /* live dot, ticks, "Leave by", today ring */
  --gg-warning:        #E0B25C; /* "Leave by … (N min)" when ≤30 min */
  --gg-danger:         #CB645D; /* cancelled / postponed / date changed / too late */
  --gg-accent-red:     #CB6167; /* section icons */

  /* ---- Category colours (tags, chips, filter checkboxes) ---------------- */
  --gg-cat-live-bands: #E0736F;
  --gg-cat-djs:        #A98BEA;
  --gg-cat-festivals:  #E6A24C;
  --gg-cat-concerts:   #6FA8DC;
  --gg-cat-theatre:    #D77FB8;
  --gg-cat-comedy:     #E3CB5B;
  --gg-cat-cabaret:    #EE8FA6;
  --gg-cat-dance:      #4FC1B0;
  --gg-cat-cultural:   #8CC46E;
  --gg-cat-family:     #7FC8E8; /* Felix, 15 Oct 2026 */
  --gg-cat-tribute:    #C9A26B; /* Felix, 15 Oct 2026 */
  --gg-cat-other:      #B5B5B5; /* Felix, 15 Oct 2026 */
  /* Tag rest  = bg: colour @ 14% (hex + "24"), border: colour @ 33% (hex + "55"), text: colour
     Tag on    = bg: colour, border: colour, text: #0B0B0B */

  /* ---- Status pills ----------------------------------------------------- */
  --gg-status-upcoming-bg: #28302A; --gg-status-upcoming-fg: #78B29C;
  --gg-status-alert-bg:    #CB645D; --gg-status-alert-fg:    #FFFFFF; /* cancelled, postponed, date changed */
  --gg-status-muted-bg:    #2A2A2A; --gg-status-muted-fg:    #CFCFCF; /* sold out, unverified */

  /* ---- Sponsored / Featured rainbow ------------------------------------- */
  --gg-rainbow-stops: #FF5F6D, #FFC371, #F9F871, #47E891, #3EC6FF, #7B6CFF, #E86CFF, #FF5F6D;

  /* ---- Typography ------------------------------------------------------- */
  --gg-font-display: "Jost", "Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; /* headings, buttons, labels, numerals */
  --gg-font-body:    "Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --gg-fs-hero:     clamp(36px, 5vw, 64px); /* H1, 700, lh 1.15, ls -0.035em */
  --gg-fs-h1:       clamp(25px, 3.2vw, 38px);
  --gg-fs-h2:       24px;   /* section titles, 700, ls -0.03em */
  --gg-fs-h3:       20px;
  --gg-fs-card-title: 17.5px; /* act name on list rows, 700, ls -0.015em */
  --gg-fs-lead:     16.5px; /* hero intro, lh 1.5 */
  --gg-fs-body:     15px;
  --gg-fs-ui:       14px;   /* buttons, list items */
  --gg-fs-small:    13.5px;
  --gg-fs-meta:     13px;
  --gg-fs-caption:  12.5px;
  --gg-fs-micro:    11px;   /* eyebrow labels, uppercase, ls 0.1em */
  --gg-fs-nano:     10px;   /* field labels, uppercase, ls 0.1em */

  /* ---- Spacing scale (only these) --------------------------------------- */
  --gg-space-1: 4px;
  --gg-space-2: 8px;
  --gg-space-3: 12px;
  --gg-space-4: 16px;
  --gg-space-5: 24px;
  --gg-space-6: 32px;
  --gg-space-7: 48px;
  --gg-gutter:  26px;   /* page side padding at all widths */
  --gg-content: 1220px; /* max content width (header, hero, sections) */

  /* ---- Control heights -------------------------------------------------- */
  --gg-h-sm: 32px;  /* chips, filter pills (desktop) */
  --gg-h-md: 36px;  /* header buttons, card CTAs (desktop) */
  --gg-h-lg: 48px;  /* primary search / sheet actions */
  --gg-h-touch: 44px; /* minimum on < 1000px viewports */

  /* ---- Radius ----------------------------------------------------------- */
  --gg-radius-xs: 4px;  /* tags */
  --gg-radius:    5px;  /* default: buttons, cards, inputs, dropdowns */
  --gg-radius-lg: 12px; /* bottom sheets (top corners) */

  /* ---- Elevation -------------------------------------------------------- */
  --gg-shadow-pop:   0 18px 40px rgba(0, 0, 0, 0.62); /* dropdowns / popovers */
  --gg-shadow-small: 0 12px 30px rgba(0, 0, 0, 0.60); /* "+N more" popover */
  --gg-shadow-cta:   0 6px 20px rgba(255, 255, 255, 0.12); /* primary hover glow */

  /* ---- Z-index ---------------------------------------------------------- */
  --gg-z-hero: 45;       /* hero/search band sits above page content */
  --gg-z-search: 50;
  --gg-z-header: 60;     /* sticky header + category bar */
  --gg-z-city: 65;
  --gg-z-dropdown: 70;
  --gg-z-bottom-nav: 80;
  --gg-z-more: 90;
  --gg-z-sheet-scrim: 94;
  --gg-z-sheet: 95;
  --gg-z-fullscreen: 110; /* phone calendar */
  --gg-z-fullscreen-search: 130;

  /* ---- Motion ----------------------------------------------------------- */
  --gg-ease: ease;
  --gg-dur-fast: 100ms;  /* press translate */
  --gg-dur: 150ms;       /* colour / border / shadow */
  --gg-rainbow-spin: 4s; /* sponsored border rotation */
  --gg-rainbow-shine: 6s;/* SPONSORED / FEATURED text shimmer */

  /* ---- Breakpoints (reference; use in media queries) -------------------- */
  /* phone < 560 · narrow < 760 · tablet < 900 (1-col event) · compact < 1000 · desktop ≥ 1000 */
}