/* ============================================================
   RepuestosMax — variables.css · Tokens de diseño
   ============================================================ */
:root {
  --navy: #1E3A8A;
  --navy-dark: #172B66;
  --navy-light: #2E4BA6;
  --red: #DC2626;
  --red-dark: #B91C1C;
  --gray-dark: #374151;
  --white: #FFFFFF;
  --gray-50: #F8FAFC;
  --gray-100: #F1F5F9;
  --gray-200: #E2E8F0;
  --gray-300: #CBD5E1;
  --gray-400: #94A3B8;
  --gray-500: #64748B;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1E293B;
  --gray-900: #0F172A;

  --text: #374151;
  --text-strong: #1E293B;
  --text-muted: #64748B;
  --bg: #FFFFFF;
  --bg-alt: #F8FAFC;
  --border: #E2E8F0;
  --success: #16A34A;
  --warning: #D97706;

  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;

  --radius-sm: 8px; --radius: 12px; --radius-lg: 18px; --radius-full: 999px;

  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08);
  --shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 24px 56px rgba(15, 23, 42, 0.16);

  --container: 1240px;
  --header-h: 70px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --transition: 0.32s var(--ease);
  --z-header: 1000; --z-drawer: 1500; --z-modal: 1600; --z-toast: 2000;
}