/* ==========================================================================
   ADS / DCOS shared design tokens — ONE source for the black-and-gold look
   and the type scale. Loaded by index.html, book.html and portal.html BEFORE
   their own styles. Presentation only: no layout, logic or Firebase impact.
   Change a value here and the portal + booking page follow.
   ========================================================================== */
:root {
  /* Type scale — nothing user-facing goes below 12px */
  --ds-fs-xs: 12px;
  --ds-fs-sm: 13px;
  --ds-fs-md: 14px;
  --ds-fs-base: 16px;

  /* Shape + touch */
  --ds-radius-sm: 10px;
  --ds-radius-md: 12px;
  --ds-radius-lg: 18px;
  --ds-touch: 44px;

  /* Brand constants (do not change with light/dark) */
  --ds-brand-gold: #C9A84B;
  --ds-brand-gold-mid: #D4AF37;
  --ds-brand-gold-light: #E8D48B;
  --ds-brand-gold-dark: #A88B2E;
  --ds-brand-navy: #0B1426;
  --ds-brand-navy-mid: #121E33;
  --ds-brand-navy-light: #1A2A45;
  --ds-brand-navy-card: #152238;
  --ds-brand-text: #F5F0E6;
  --ds-brand-muted: #A8B0C0;
  --ds-brand-line: rgba(201, 168, 75, .22);

  /* Semantic tokens — dark (default) */
  --ds-bg: #0B1426;
  --ds-card: #121E33;
  --ds-card2: #1A2A45;
  --ds-text: #F5F0E6;
  --ds-muted: #A8B0C0;
  --ds-line: rgba(201, 168, 75, .24);
  --ds-gold: #C9A84B;
  --ds-gold-hi: #E8D48B;
  --ds-ink: #1a1405;
  --ds-ok: #4ade80;
  --ds-warn: #fbbf24;
  --ds-bad: #f87171;
  --ds-info: #7dd3fc;
  --ds-shadow: 0 10px 30px rgba(0, 0, 0, .35);
}

/* Semantic tokens — light */
html.light {
  --ds-bg: #F7F4EC;
  --ds-card: #FFFFFF;
  --ds-card2: #F3EEDF;
  --ds-text: #1b1710;
  --ds-muted: #5f5849;
  --ds-line: rgba(140, 112, 30, .32);
  --ds-gold: #A88B2E;
  --ds-gold-hi: #6f5a14;
  --ds-ok: #15803d;
  --ds-warn: #a16207;
  --ds-bad: #b91c1c;
  --ds-info: #0369a1;
  --ds-shadow: 0 8px 24px rgba(60, 45, 10, .12);
}

/* Tailwind arbitrary tiny sizes (text-[10px] / text-[11px]) used across the
   staff app and booking page are raised to the shared 12px floor. */
.text-\[10px\], .text-\[11px\] {
  font-size: var(--ds-fs-xs, 12px) !important;
  line-height: 1.35 !important;
}
