/**
 * FASCO Pakistan - Design System Variables
 * Modern, Industrial, High-Conversion Safety Ecommerce
 */
:root {
  /* Brand Color Palette */
  --fasco-red: #E31B23;
  --fasco-red-hover: #C5131A;
  --fasco-red-dark: #A50E14;
  --fasco-red-light: rgba(227, 27, 35, 0.08);
  --fasco-red-glow: rgba(227, 27, 35, 0.25);

  /* WhatsApp Direct Ordering Palette */
  --fasco-whatsapp: #25D366;
  --fasco-whatsapp-hover: #1EBE5D;
  --fasco-whatsapp-dark: #128C7E;
  --fasco-whatsapp-light: rgba(37, 211, 102, 0.12);
  --fasco-whatsapp-glow: rgba(37, 211, 102, 0.35);

  --fasco-charcoal: #111111;
  --fasco-charcoal-light: #1A1A1A;
  --fasco-charcoal-border: #2D2D2D;
  --fasco-black: #050505;
  --fasco-white: #FFFFFF;

  --fasco-bg-light: #F5F6F7;
  --fasco-bg-surface: #FFFFFF;
  --fasco-bg-muted: #F8FAFC;

  --fasco-border: #E5E7EB;
  --fasco-border-subtle: #F1F5F9;
  --fasco-border-focus: #E31B23;

  /* Typography Colors */
  --fasco-text-main: #1E293B;
  --fasco-text-heading: #0F172A;
  --fasco-text-muted: #64748B;
  --fasco-text-light: #94A3B8;
  --fasco-text-inverse: #FFFFFF;

  /* Status Colors */
  --fasco-success: #10B981;
  --fasco-warning: #F59E0B;
  --fasco-info: #0284C7;
  --fasco-danger: #EF4444;

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

  /* Shadows */
  --fasco-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
  --fasco-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
  --fasco-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  --fasco-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);
  --fasco-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
  --fasco-shadow-card-hover: 0 16px 32px rgba(17, 17, 17, 0.1);
  --fasco-shadow-dropdown: 0 20px 40px rgba(0, 0, 0, 0.12);

  /* Radius */
  --fasco-radius-sm: 4px;
  --fasco-radius-md: 8px;
  --fasco-radius-lg: 12px;
  --fasco-radius-xl: 16px;
  --fasco-radius-pill: 9999px;

  /* Layout */
  --fasco-container-max: 1320px;
  --fasco-container-padding: 24px;
  --fasco-header-height-desktop: 80px;
  --fasco-announcement-height: 40px;
  --fasco-nav-height: 52px;

  /* Transitions */
  --fasco-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --fasco-transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --fasco-transition-smooth: 350ms cubic-bezier(0.16, 1, 0.3, 1);
}