/* Lazy Bite — variables.css : the single source of truth for design tokens.
   Change --primary here and the whole product re-skins. */
:root {
  /* Brand */
  --primary: #ff5a1f;
  --primary-dark: #e2352b;
  --primary-soft: #fff2ec;
  --primary-softer: #fff8f5;
  --primary-ring: rgba(255, 90, 31, .28);

  /* Semantic */
  --success: #16a34a;
  --success-soft: #e7f7ed;
  --warning: #f59e0b;
  --warning-soft: #fef4e2;
  --danger: #dc2626;
  --danger-soft: #fdecec;
  --info: #2563eb;
  --info-soft: #eaf1ff;
  --focus: #2563eb;

  /* Neutrals */
  --background: #ffffff;
  --surface: #f7f8fa;
  --surface-2: #eef1f5;
  --surface-inverse: #0f172a;
  --border: #e6e8ec;
  --border-strong: #d3d8e0;
  --overlay: rgba(15, 23, 42, .55);

  /* Text */
  --text-primary: #0f172a;
  --text-secondary: #64748b;
  --text-muted: #94a3b8;
  --text-inverse: #ffffff;

  /* Dashboard chrome */
  --sidebar-bg: #0f172a;
  --sidebar-bg-2: #16203a;
  --sidebar-text: #b9c4d8;
  --sidebar-text-active: #ffffff;

  /* Typography */
  --font-sans: 'Inter', 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-display: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

  --fs-xs: .75rem;
  --fs-sm: .8125rem;
  --fs-base: .9375rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: clamp(1.25rem, 1.1rem + .6vw, 1.5rem);
  --fs-2xl: clamp(1.5rem, 1.25rem + 1.1vw, 2rem);
  --fs-3xl: clamp(1.85rem, 1.4rem + 2vw, 2.75rem);
  --fs-hero: clamp(2.25rem, 1.5rem + 3.6vw, 4rem);

  /* Spacing scale */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-7: 32px; --sp-8: 40px;
  --sp-9: 48px; --sp-10: 64px; --sp-11: 80px; --sp-12: 96px;

  /* Radius */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  /* Elevation */
  --shadow-xs: 0 1px 2px rgba(15,23,42,.06);
  --shadow-sm: 0 1px 3px rgba(15,23,42,.08), 0 1px 2px rgba(15,23,42,.04);
  --shadow-md: 0 6px 18px rgba(15,23,42,.08);
  --shadow-lg: 0 18px 40px rgba(15,23,42,.12);
  --shadow-xl: 0 30px 70px rgba(15,23,42,.18);

  /* Layout */
  --container: 1200px;
  --container-wide: 1400px;
  --header-h: 72px;
  --bottomnav-h: 64px;
  --sidebar-w: 248px;
  --sidebar-w-collapsed: 76px;

  /* Motion */
  --ease: cubic-bezier(.2, .7, .3, 1);
  --dur-fast: .14s;
  --dur: .22s;
  --dur-slow: .38s;

  /* Z-index scale */
  --z-sticky: 100;
  --z-header: 200;
  --z-drawer: 300;
  --z-modal: 400;
  --z-toast: 500;
}
