/**
 * HEAVY MACHINERY - Global Industrial Marketplace - Design System Variables
 * Theme: Light Industrial Precision
 * Primary: Deep Teal / Industrial Green
 * Backgrounds: Warm Ivory / Off-White / Soft Stone Gray
 * Typography: Modern Sans-Serif Precision System
 */

:root {
  /* ==========================================================================
     Color Palette - Light Industrial Theme
     ========================================================================== */
  
  /* Primary: Deep Teal / Industrial Precision Green */
  --color-primary-900: #082824;
  --color-primary-800: #0C3E38;
  --color-primary-700: #104E46;
  --color-primary-600: #16655A;
  --color-primary-500: #1B7A6D;
  --color-primary-400: #259686;
  --color-primary-300: #57B5A8;
  --color-primary-200: #98D4CC;
  --color-primary-100: #D6EFEA;
  --color-primary-50:  #EEF7F5;
  --color-primary:     var(--color-primary-700);
  --color-primary-hover: var(--color-primary-800);
  
  /* Surface & Backgrounds: Warm Ivory / Stone Gray */
  --color-bg-body:      #F8F9F6;
  --color-bg-surface:   #FFFFFF;
  --color-bg-subtle:    #F2F4EF;
  --color-bg-warm:      #FAF8F5;
  --color-bg-card:      #FFFFFF;
  --color-bg-card-hover:#FAFCFA;
  --color-bg-elevated:  #FFFFFF;
  --color-bg-muted:     #E8EBE4;
  
  /* Text & Contrast: Deep Charcoal System */
  --color-text-main:    #121922;
  --color-text-heading: #0D141C;
  --color-text-body:    #334155;
  --color-text-muted:   #64748B;
  --color-text-light:   #94A3B8;
  --color-text-inverse: #FFFFFF;
  
  /* Borders & Dividers */
  --color-border-subtle: #E5E9E2;
  --color-border-medium: #D1D8CD;
  --color-border-strong: #A8B3A2;
  --color-border-focus:  var(--color-primary-500);

  /* Status & Verification Colors */
  --color-success:       #059669;
  --color-success-bg:    #ECFDF5;
  --color-success-border:#A7F3D0;
  --color-verified:      #059669;
  --color-verified-bg:   #EDFBF6;
  
  --color-warning:       #D97706;
  --color-warning-bg:    #FFFBEB;
  --color-warning-border:#FDE68A;
  
  --color-info:          #0284C7;
  --color-info-bg:       #F0F9FF;
  
  /* Subtle Accent: Muted Industrial Gold / Brass */
  --color-accent-gold:   #B89558;
  --color-accent-subtle: #F6F1E8;
  --color-accent-border: #E8D9BF;

  /* ==========================================================================
     Typography System
     ========================================================================== */
  --font-family-sans:    'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-family-display: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-family-mono:    'JetBrains Mono', 'SF Mono', Consolas, Monaco, monospace;
  
  --font-size-xs:   0.75rem;     /* 12px */
  --font-size-sm:   0.84375rem;  /* 13.5px */
  --font-size-base: 0.9375rem;   /* 15px */
  --font-size-md:   1.0625rem;   /* 17px */
  --font-size-lg:   1.1875rem;   /* 19px */
  --font-size-xl:   1.375rem;    /* 22px */
  --font-size-2xl:  1.6875rem;   /* 27px */
  --font-size-3xl:  2.125rem;    /* 34px */
  --font-size-4xl:  2.75rem;     /* 44px */
  --font-size-5xl:  3.5rem;      /* 56px */
  --font-size-hero: clamp(2.5rem, 5vw + 1rem, 4.25rem); /* Responsive fluid hero */

  --font-weight-regular:  400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;
  --font-weight-extrabold:800;

  --line-height-tight:   1.12;
  --line-height-snug:    1.25;
  --line-height-normal:  1.5;
  --line-height-relaxed: 1.65;
  
  --letter-spacing-tight:  -0.025em;
  --letter-spacing-normal: -0.01em;
  --letter-spacing-wide:   0.05em;
  --letter-spacing-tag:    0.1em;

  /* ==========================================================================
     Layout, Spacing & Container
     ========================================================================== */
  --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 */
  --space-20: 5rem;    /* 80px */
  --space-24: 6rem;    /* 96px */
  
  --container-max-width: 1360px;
  --container-padding:   clamp(1rem, 3vw, 2.5rem);

  /* ==========================================================================
     Border Radius
     ========================================================================== */
  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-xl:   20px;
  --radius-2xl:  28px;
  --radius-pill: 9999px;
  --radius-card: 16px;

  /* ==========================================================================
     Elevation & Shadows (Precision Industrial, Soft & Subtle)
     ========================================================================== */
  --shadow-subtle: 0 1px 3px rgba(18, 25, 34, 0.04), 0 1px 2px rgba(18, 25, 34, 0.02);
  --shadow-sm:     0 2px 6px rgba(18, 25, 34, 0.05), 0 1px 3px rgba(18, 25, 34, 0.03);
  --shadow-md:     0 8px 20px rgba(18, 25, 34, 0.06), 0 2px 6px rgba(18, 25, 34, 0.03);
  --shadow-lg:     0 16px 36px rgba(18, 25, 34, 0.08), 0 4px 12px rgba(18, 25, 34, 0.04);
  --shadow-xl:     0 24px 54px rgba(18, 25, 34, 0.10), 0 8px 20px rgba(18, 25, 34, 0.05);
  --shadow-card:   0 3px 12px rgba(22, 34, 45, 0.05), 0 1px 3px rgba(22, 34, 45, 0.03);
  --shadow-card-hover: 0 16px 32px rgba(16, 78, 70, 0.10), 0 4px 10px rgba(22, 34, 45, 0.04);
  --shadow-glow-teal: 0 0 0 3px rgba(22, 101, 90, 0.18);

  /* ==========================================================================
     Transitions & Timing
     ========================================================================== */
  --transition-fast:   150ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 260ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 400ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-bounce: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ==========================================================================
     Z-Index Hierarchy
     ========================================================================== */
  --z-negative: -1;
  --z-normal:   1;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-fixed:    300;
  --z-backdrop: 400;
  --z-modal:    500;
  --z-toast:    600;
  --z-tooltip:  700;
}
