/**
 * KANAHIYA SUPERMART - Modern Design Tokens & Variables
 * Theme: World-Class Vibrant Hyperlocal Supermarket & Grocery Store
 * Inspired by modern Blinkit, BigBasket, Zepto & Amazon Fresh
 */

:root {
  /* Brand Primary Colors - Fresh Vibrant Supermarket Green */
  --ksm-primary: #16a34a;
  --ksm-primary-hover: #15803d;
  --ksm-primary-dark: #14532d;
  --ksm-primary-deep: #052e16;
  --ksm-primary-light: #22c55e;
  --ksm-primary-bright: #16a34a;
  --ksm-primary-ultralight: #f0fdf4;
  --ksm-primary-surface: #f7fee7;
  --ksm-primary-border: #bbf7d0;
  --ksm-primary-glow: rgba(22, 163, 74, 0.28);

  /* Brand Secondary & Accent Colors - Dark Mustard Gold & Warm Honey Yellow */
  --ksm-accent: #ca8a04;
  --ksm-accent-hover: #a16207;
  --ksm-accent-dark: #854d0e;
  --ksm-accent-light: #fef08a;
  --ksm-accent-warm: #eab308;
  --ksm-accent-soft: #fefce8;
  --ksm-accent-border: #fde047;
  --ksm-accent-glow: rgba(202, 138, 4, 0.35);

  /* Signature Dark Yellow & Green Gradients */
  --ksm-gradient-primary: linear-gradient(135deg, #ca8a04 0%, #16a34a 100%);
  --ksm-gradient-hover: linear-gradient(135deg, #a16207 0%, #15803d 100%);
  --ksm-gradient-gold: linear-gradient(135deg, #eab308 0%, #ca8a04 100%);
  --ksm-gradient-green: linear-gradient(135deg, #22c55e 0%, #15803d 100%);
  --ksm-gradient-hero: linear-gradient(135deg, #052e16 0%, #14532d 45%, #ca8a04 100%);
  --ksm-gradient-card: linear-gradient(135deg, #ca8a04 0%, #15803d 100%);
  --ksm-gradient-dark: linear-gradient(135deg, #052e16 0%, #0b3d2c 50%, #14532d 100%);

  /* Fresh Pure & Veg Grocery Green */
  --ksm-fresh: #16a34a;
  --ksm-fresh-light: #22c55e;
  --ksm-fresh-soft: #f0fdf4;
  --ksm-fresh-border: #86efac;

  /* Discount & Alert Colors */
  --ksm-discount-red: #ef4444;
  --ksm-discount-dark: #dc2626;
  --ksm-discount-soft: #fef2f2;
  --ksm-discount-border: #fecaca;

  /* Deep Forest Green & Jade Base */
  --ksm-dark-navy: #052e16;
  --ksm-dark-card: #0b3d2c;
  --ksm-dark-surface: #14532d;
  --ksm-dark-border: #1e4d3a;
  --ksm-dark-muted: #86efac;

  /* Text & Neutral Grayscale */
  --ksm-text-heading: #0f172a;
  --ksm-text-body: #334155;
  --ksm-text-muted: #64748b;
  --ksm-text-light: #94a3b8;
  --ksm-white: #ffffff;
  --ksm-bg-light: #f8fafc;
  --ksm-bg-subtle: #f1f5f9;
  --ksm-bg-card: #ffffff;
  --ksm-border: #e2e8f0;
  --ksm-border-light: #f1f5f9;
  --ksm-border-strong: #cbd5e1;

  /* Social & Utility Colors */
  --ksm-whatsapp: #25d366;
  --ksm-whatsapp-dark: #128c7e;
  --ksm-whatsapp-light: #dcf8c6;
  --ksm-phone: #0284c7;
  --ksm-phone-dark: #0369a1;
  --ksm-star: #f59e0b;
  --ksm-blue: #2563eb;
  --ksm-purple: #8b5cf6;

  /* Category Pastel Backgrounds */
  --cat-bg-green: #ecfdf5;
  --cat-bg-yellow: #fffbeb;
  --cat-bg-orange: #fff7ed;
  --cat-bg-red: #fef2f2;
  --cat-bg-purple: #faf5ff;
  --cat-bg-blue: #eff6ff;
  --cat-bg-teal: #f0fdfa;
  --cat-bg-cyan: #ecfeff;
  --cat-bg-pink: #fdf2f8;
  --cat-bg-slate: #f8fafc;

  /* Modern Glassmorphism Tokens */
  --ksm-glass-bg: rgba(255, 255, 255, 0.85);
  --ksm-glass-dark-bg: rgba(11, 19, 41, 0.88);
  --ksm-glass-border: rgba(255, 255, 255, 0.35);
  --ksm-glass-dark-border: rgba(255, 255, 255, 0.12);

  /* Modern Typography Font Stacks */
  --ksm-font-heading: 'Outfit', 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --ksm-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --ksm-font-alt: 'Plus Jakarta Sans', 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Multi-Tier Layered Elevation Shadows */
  --ksm-shadow-xs: 0 1px 2px 0 rgba(15, 23, 42, 0.05);
  --ksm-shadow-sm: 0 2px 8px -2px rgba(15, 23, 42, 0.08), 0 1px 4px -1px rgba(15, 23, 42, 0.04);
  --ksm-shadow-md: 0 6px 18px -3px rgba(15, 23, 42, 0.08), 0 2px 8px -2px rgba(15, 23, 42, 0.04);
  --ksm-shadow-lg: 0 14px 28px -4px rgba(15, 23, 42, 0.10), 0 6px 12px -3px rgba(15, 23, 42, 0.05);
  --ksm-shadow-xl: 0 24px 38px -6px rgba(15, 23, 42, 0.12), 0 10px 18px -4px rgba(15, 23, 42, 0.06);
  --ksm-shadow-hover: 0 14px 30px -4px rgba(202, 138, 4, 0.28), 0 4px 12px -2px rgba(22, 163, 74, 0.15);
  --ksm-shadow-card: 0 4px 20px -2px rgba(15, 23, 42, 0.06);

  /* Border Radii */
  --ksm-radius-xs: 4px;
  --ksm-radius-sm: 8px;
  --ksm-radius-md: 12px;
  --ksm-radius-lg: 18px;
  --ksm-radius-xl: 26px;
  --ksm-radius-pill: 9999px;

  /* Spacing & Transitions */
  --ksm-container-max: 1340px;
  --ksm-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --ksm-transition-fast: all 0.15s ease;
  --ksm-transition-bounce: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}