/* ══════════════════════════════════════════════════════════════
   DESIGN TOKENS — Tour AI Manager
   Single source of truth for all visual properties.
   ══════════════════════════════════════════════════════════════ */

:root {
  /* ── Color: App background ─────────────────────────────── */
  --color-app-bg:          #F2F5F9;
  --color-surface:         #FFFFFF;
  --color-surface-muted:   #F8FAFC;
  --color-surface-hover:   #F1F5F9;

  /* ── Color: Borders ────────────────────────────────────── */
  --color-border:          #E2E8F0;
  --color-border-strong:   #CBD5E1;
  --color-border-focus:    #94A3B8;

  /* ── Color: Text ───────────────────────────────────────── */
  --color-text-primary:    #14213D;
  --color-text-secondary:  #4A5568;
  --color-text-muted:      #94A3B8;
  --color-text-disabled:   #CBD5E1;
  --color-text-inverse:    #FFFFFF;

  /* ── Color: Primary ────────────────────────────────────── */
  --color-primary:         #1E3A5F;
  --color-primary-hover:   #162D4A;
  --color-primary-active:  #0F2036;
  --color-primary-soft:    #EBF2F9;
  --color-primary-muted:   #DBEAFE;

  /* ── Color: Semantic ───────────────────────────────────── */
  --color-success:         #15803D;
  --color-success-soft:    #DCFCE7;
  --color-success-border:  #BBF7D0;
  --color-warning:         #B45309;
  --color-warning-soft:    #FEF3C7;
  --color-warning-border:  #FDE68A;
  --color-danger:          #B91C1C;
  --color-danger-soft:     #FEE2E2;
  --color-danger-border:   #FECACA;
  --color-info:            #0369A1;
  --color-info-soft:       #E0F2FE;
  --color-info-border:     #BAE6FD;

  /* ── Color: AI accent ──────────────────────────────────── */
  --color-ai:              #6D28D9;
  --color-ai-hover:        #5B21B6;
  --color-ai-soft:         #EDE9FE;
  --color-ai-border:       #DDD6FE;

  /* ── Sidebar ───────────────────────────────────────────── */
  --sidebar-width:         224px;
  --sidebar-width-collapsed: 56px;
  --sidebar-bg:            #1A2840;
  --sidebar-border:        #243352;
  --sidebar-text:          #94A3B8;
  --sidebar-text-hover:    #E2E8F0;
  --sidebar-text-active:   #FFFFFF;
  --sidebar-item-hover:    rgba(255,255,255,0.06);
  --sidebar-item-active:   rgba(255,255,255,0.12);
  --sidebar-icon-size:     18px;

  /* ── Spacing scale (4px base) ──────────────────────────── */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;

  /* ── Border radius ─────────────────────────────────────── */
  --radius-sm:   6px;
  --radius-md:   8px;
  --radius-control: 8px;
  --radius-card: 12px;
  --radius-lg:   16px;
  --radius-xl:   20px;
  --radius-full: 9999px;

  /* ── Shadows — used sparingly ──────────────────────────── */
  --shadow-sm:   0 1px 2px rgba(0,0,0,0.04), 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md:   0 4px 6px rgba(0,0,0,0.04), 0 2px 4px rgba(0,0,0,0.06);
  --shadow-card: 0 1px 3px rgba(20,33,61,0.06);
  --shadow-dropdown: 0 8px 24px rgba(0,0,0,0.10), 0 2px 8px rgba(0,0,0,0.06);
  --shadow-modal: 0 24px 48px rgba(0,0,0,0.12);

  /* ── Typography ────────────────────────────────────────── */
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', system-ui, sans-serif;
  --font-mono: 'SF Mono', 'Fira Code', Consolas, monospace;

  --text-xs:    11px;
  --text-sm:    13px;
  --text-base:  14px;
  --text-md:    15px;
  --text-lg:    17px;
  --text-xl:    20px;
  --text-2xl:   24px;
  --text-3xl:   28px;

  --font-normal:   400;
  --font-medium:   500;
  --font-semibold: 600;
  --font-bold:     700;

  --leading-tight:  1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  /* ── Control heights ───────────────────────────────────── */
  --control-sm:  30px;
  --control-md:  36px;
  --control-lg:  42px;

  /* ── Z-index layers ────────────────────────────────────── */
  --z-base:     1;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-header:   300;
  --z-sidebar:  400;
  --z-overlay:  500;
  --z-modal:    600;
  --z-toast:    700;
  --z-tooltip:  800;

  /* ── Transitions ───────────────────────────────────────── */
  --transition-fast:   120ms ease;
  --transition-base:   180ms ease;
  --transition-slow:   280ms ease;

  /* ── Header ────────────────────────────────────────────── */
  --header-height: 56px;
}