/* BYNZO Design Tokens
 * Laravel later: map to resources/css/app.css or a design-token JSON.
 */
:root {
  --bnz-orange: #ff6b1a;
  --bnz-orange-hover: #ff812e;
  --bnz-orange-pressed: #e85d0f;
  --bnz-orange-soft: #fff1e8;
  --bnz-orange-ring: rgba(255, 107, 26, 0.22);

  --bnz-black: #0b0b0c;
  --bnz-ink: #141416;
  --bnz-elev: #1b1b1e;
  --bnz-elev-2: #232328;

  --bnz-white: #ffffff;
  --bnz-bg: #f4f4f6;
  --bnz-surface: #ffffff;
  --bnz-surface-2: #fafafa;
  --bnz-border: #e6e6ea;
  --bnz-border-strong: #d4d4d8;

  --bnz-text: #18181b;
  --bnz-text-2: #3f3f46;
  --bnz-muted: #71717a;
  --bnz-faint: #a1a1aa;

  --bnz-success: #16a34a;
  --bnz-success-soft: #dcfce7;
  --bnz-danger: #dc2626;
  --bnz-danger-soft: #fee2e2;
  --bnz-warning: #d97706;
  --bnz-warning-soft: #fef3c7;
  --bnz-info: #2563eb;
  --bnz-info-soft: #dbeafe;

  --font: "Plus Jakarta Sans", "IBM Plex Sans Arabic", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-md: 0.9375rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: 2.125rem;

  --lh: 1.5;
  --fw-md: 500;
  --fw-sb: 600;
  --fw-bd: 700;
  --fw-ex: 800;

  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-full: 999px;

  --shadow-sm: 0 1px 2px rgba(15, 15, 16, 0.05);
  --shadow: 0 8px 28px rgba(15, 15, 16, 0.06);
  --shadow-lg: 0 18px 50px rgba(15, 15, 16, 0.12);
  --shadow-pop: 0 12px 40px rgba(255, 107, 26, 0.18);

  --sidebar-w: 272px;
  --sidebar-collapsed: 80px;
  --topbar-h: 68px;
  --bottom-h: 72px;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --z-nav: 40;
  --z-top: 50;
  --z-dropdown: 60;
  --z-modal: 80;
  --z-toast: 90;
}

@media (prefers-reduced-motion: reduce) {
  :root { --ease: linear; }
}