/* TableSide Admin Design System v1, design tokens.
   Loaded on every admin page; values only take effect under body.redesign.
   The tokens themselves are global so components can reference them
   without the parent caring about flag state. */
:root {
  /* Brand */
  --ts-forest: #1F3A2E;
  --ts-forest-deep: #16291F;
  --ts-cream: #F5EFE0;
  --ts-cream-soft: #EFE7D2;
  --ts-cream-deep: #E8DFC4;

  /* Ink */
  --ts-ink: #1F3A2E;
  --ts-ink-soft: #4A6555;
  --ts-ink-mute: #7A8C82;
  --ts-cream-text: #F5EFE0;
  --ts-cream-text-soft: #C9BFA5;

  /* Status */
  --ts-coral: #B85C3A;
  --ts-coral-bg: #E8C4B0;
  --ts-amber: #B8842A;
  --ts-amber-bg: #E8D4A0;
  --ts-green: #3B6D11;
  --ts-green-bg: #C0DD97;
  --ts-purple: #534AB7;
  --ts-pink: #993556;

  /* Tier */
  --ts-tier-bronze-bg: #E8C4B0; --ts-tier-bronze-text: #712B13;
  --ts-tier-silver-bg: #D3D1C7; --ts-tier-silver-text: #444441;
  --ts-tier-gold-bg: #FAC775; --ts-tier-gold-text: #633806;
  --ts-tier-platinum-bg: #B5D4F4; --ts-tier-platinum-text: #0C447C;
  --ts-tier-vip-bg: #1F3A2E; --ts-tier-vip-text: #F5EFE0;

  /* Layout */
  --ts-radius-md: 8px;
  --ts-radius-lg: 10px;
  --ts-radius-xl: 12px;
  --ts-border: 0.5px solid rgba(31, 58, 46, 0.10);
  --ts-border-strong: 0.5px solid rgba(31, 58, 46, 0.15);

  /* Type */
  --ts-font-serif: 'Cormorant Garamond', Georgia, serif;
  --ts-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Spacing scale (4px grid) */
  --ts-sp-1: 4px;
  --ts-sp-2: 8px;
  --ts-sp-3: 12px;
  --ts-sp-4: 16px;
  --ts-sp-5: 20px;
  --ts-sp-6: 24px;
  --ts-sp-8: 32px;
  --ts-sp-10: 40px;

  /* Elevation */
  --ts-shadow-sm: 0 1px 2px rgba(31, 58, 46, 0.06);
  --ts-shadow-md: 0 4px 12px rgba(31, 58, 46, 0.08);
  --ts-shadow-lg: 0 12px 32px rgba(31, 58, 46, 0.12);

  /* Motion */
  --ts-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ts-dur-fast: 120ms;
  --ts-dur-base: 200ms;
}