/* ── Zaplet Design Tokens ───────────────────────────────────────────────────
   Single source of truth for all design variables.
   Linked from every HTML page via: <link rel="stylesheet" href="/css/tokens.css">
   Served by: app.mount("/css", StaticFiles(directory="html/css"), name="css")
────────────────────────────────────────────────────────────────────────── */

:root {
  /* ── Core palette ─────────────────────────────── */
  --color-bg:             #1A1A1A;
  --color-surface:        #202020;
  --color-surface-raised: #2e2e2e;   /* dropdowns, tooltips above surface */
  --color-hover:          #333333;
  --color-cream:          #FDF7E2;
  --color-ash:            #A09B92;
  --color-gold:           #C79841;
  --color-gold-hover:     #d4a84e;   /* replaces hardcoded #d4a84e everywhere */
  --color-error:          #8B2E2E;
  --color-success:        #4A6B4A;
  --color-blue:           #4A90D9;
  --card-border:          rgba(199, 152, 65, 0.2);

  /* ── Shadows ──────────────────────────────────── */
  --shadow-sm:       0 2px 10px rgba(0, 0, 0, 0.35);
  --shadow-md:       0 4px 24px rgba(0, 0, 0, 0.5);
  --shadow-lg:       0 8px 40px rgba(0, 0, 0, 0.65);
  --shadow-dropdown: 0 8px 32px rgba(0, 0, 0, 0.55);
  --shadow-gold:     0 4px 20px var(--gold-20);
  --shadow-gold-strong: 0 4px 20px var(--gold-35);

  /* ── Extended palette (not yet tokenized) ─────── */
  --color-instagram:  #E1306C;
  --color-location:   #4A9EBF;
  --color-danger:     #c0504d;
  --color-danger-hover: #e06060;

  /* ── Gold opacity tiers ──────────────────────── */
  --gold-8:   rgba(199, 152, 65, 0.04);
  --gold-15:  rgba(199, 152, 65, 0.15);
  --gold-20:  rgba(199, 152, 65, 0.20);
  --gold-25:  rgba(199, 152, 65, 0.25);
  --gold-35:  rgba(199, 152, 65, 0.35);

  /* ── Border radius ────────────────────────────── */
  --radius-sm:    4px;
  --radius-btn:   6px;
  --radius-md:    8px;
  --radius-chip-img: 10px;
  --radius-lg:    12px;
  --radius-toast: 14px;
  --radius-sheet: 20px;
  --radius-pill:  50px;

  /* ── Transitions ──────────────────────────────── */
  --transition-fast: 0.15s ease;
  --transition-base: 0.22s ease;
}
