/* ============================================
   JOGO Design Tokens
   Professional Authority Theme
   ============================================ */

:root {
  /* Primary: Authority Navy */
  --navy-900: #1E3A8A;
  --navy-800: #1E40AF;
  --navy-700: #1D4ED8;
  --navy-600: #2563EB;
  --navy-500: #3B82F6;
  --navy-400: #60A5FA;
  --navy-300: #93C5FD;
  --navy-200: #BFDBFE;
  --navy-100: #DBEAFE;
  --navy-50: #EFF6FF;

  /* Accent: Amber Gold */
  --amber-800: #92400E;
  --amber-700: #B45309;
  --amber-600: #D97706;
  --amber-500: #F59E0B;
  --amber-400: #FBBF24;
  --amber-300: #FCD34D;
  --amber-200: #FDE68A;
  --amber-100: #FEF3C7;
  --amber-50: #FFFBEB;

  /* Semantic */
  --success-700: #047857;
  --success-600: #059669;
  --success-500: #10B981;
  --success-100: #D1FAE5;
  --success-50: #ECFDF5;

  --error-700: #B91C1C;
  --error-600: #DC2626;
  --error-500: #EF4444;
  --error-100: #FEE2E2;
  --error-50: #FEF2F2;

  --info-600: #2563EB;
  --info-100: #DBEAFE;

  --violet-700: #6D28D9;
  --violet-600: #7C3AED;
  --violet-500: #8B5CF6;
  --violet-100: #EDE9FE;
  --violet-50: #F5F3FF;

  /* Neutrals: Slate */
  --slate-950: #020617;
  --slate-900: #0F172A;
  --slate-800: #1E293B;
  --slate-700: #334155;
  --slate-600: #475569;
  --slate-500: #64748B;
  --slate-400: #94A3B8;
  --slate-300: #CBD5E1;
  --slate-200: #E2E8F0;
  --slate-100: #F1F5F9;
  --slate-50: #F8FAFC;
  --white: #FFFFFF;

  /* Typography */
  --font-heading: 'EB Garamond', 'Georgia', serif;
  --font-body: 'Lato', 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  --text-xs: 0.75rem;    /* 12px */
  --text-sm: 0.875rem;   /* 14px */
  --text-base: 1rem;     /* 16px */
  --text-lg: 1.125rem;   /* 18px */
  --text-xl: 1.25rem;    /* 20px */
  --text-2xl: 1.5rem;    /* 24px */
  --text-3xl: 2rem;      /* 32px */
  --text-4xl: 2.5rem;    /* 40px */

  /* Spacing */
  --space-1: 0.25rem;  /* 4px */
  --space-2: 0.5rem;   /* 8px */
  --space-3: 0.75rem;  /* 12px */
  --space-4: 1rem;     /* 16px */
  --space-5: 1.25rem;  /* 20px */
  --space-6: 1.5rem;   /* 24px */
  --space-8: 2rem;     /* 32px */
  --space-10: 2.5rem;  /* 40px */
  --space-12: 3rem;    /* 48px */
  --space-16: 4rem;    /* 64px */

  /* Layout */
  --sidebar-width: 280px;
  --sidebar-collapsed: 64px;
  --topbar-height: 64px;
  --content-max-width: 1280px;

  /* Borders */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  --border-color: var(--slate-200);

  /* Shadows — layered for depth */
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.03), 0 2px 4px rgba(0,0,0,0.04), 0 0 0 1px rgba(0,0,0,0.02);
  --shadow-md: 0 2px 4px rgba(0,0,0,0.03), 0 4px 8px -1px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.02);
  --shadow-lg: 0 4px 8px rgba(0,0,0,0.04), 0 8px 16px -4px rgba(0,0,0,0.08), 0 0 0 1px rgba(0,0,0,0.02);
  --shadow-xl: 0 8px 16px rgba(0,0,0,0.06), 0 16px 32px -8px rgba(0,0,0,0.1), 0 0 0 1px rgba(0,0,0,0.02);
  --shadow-card-hover: 0 4px 12px rgba(0,0,0,0.08), 0 8px 24px -8px rgba(30,58,138,0.12);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-normal: 200ms ease;
  --transition-slow: 300ms ease-out;

  /* Z-index */
  --z-sidebar: 40;
  --z-topbar: 30;
  --z-modal-backdrop: 50;
  --z-modal: 60;
  --z-toast: 70;
  --z-search: 80;
  --z-tooltip: 90;
}