/* ══════════════════════════════════════════════════════════════
   PADOSHI — Design Tokens & CSS Custom Properties
   A warm, Indian-inspired design system
   ══════════════════════════════════════════════════════════════ */

:root {
  /* ── Brand Colors ───────────────────────────────────────── */
  --primary-50:  #EEF2FF;
  --primary-100: #E0E7FF;
  --primary-200: #C7D2FE;
  --primary-300: #A5B4FC;
  --primary-400: #818CF8;
  --primary-500: #6366F1;
  --primary-600: #4F46E5;
  --primary-700: #4338CA;
  --primary-800: #3730A3;
  --primary-900: #312E81;

  --accent-50:  #FFFBEB;
  --accent-100: #FEF3C7;
  --accent-200: #FDE68A;
  --accent-300: #FCD34D;
  --accent-400: #FBBF24;
  --accent-500: #F59E0B;
  --accent-600: #D97706;
  --accent-700: #B45309;
  --accent-800: #92400E;
  --accent-900: #78350F;

  /* Saffron / Indian Orange */
  --saffron-50:  #FFF7ED;
  --saffron-100: #FFEDD5;
  --saffron-200: #FED7AA;
  --saffron-300: #FDBA74;
  --saffron-400: #FB923C;
  --saffron-500: #F97316;
  --saffron-600: #EA580C;
  --saffron-700: #C2410C;

  /* Success / Green */
  --success-50:  #ECFDF5;
  --success-100: #D1FAE5;
  --success-200: #A7F3D0;
  --success-400: #34D399;
  --success-500: #10B981;
  --success-600: #059669;
  --success-700: #047857;

  /* Danger / Red */
  --danger-50:  #FEF2F2;
  --danger-100: #FEE2E2;
  --danger-200: #FECACA;
  --danger-400: #F87171;
  --danger-500: #EF4444;
  --danger-600: #DC2626;
  --danger-700: #B91C1C;

  /* Warning / Yellow */
  --warning-50:  #FEFCE8;
  --warning-100: #FEF9C3;
  --warning-400: #FACC15;
  --warning-500: #EAB308;
  --warning-600: #CA8A04;

  /* Info / Cyan */
  --info-50:  #ECFEFF;
  --info-100: #CFFAFE;
  --info-400: #22D3EE;
  --info-500: #06B6D4;
  --info-600: #0891B2;

  /* ── Neutral Colors ─────────────────────────────────────── */
  --gray-50:  #FAFAFA;
  --gray-100: #F5F5F5;
  --gray-200: #E5E5E5;
  --gray-300: #D4D4D4;
  --gray-400: #A3A3A3;
  --gray-500: #737373;
  --gray-600: #525252;
  --gray-700: #404040;
  --gray-800: #262626;
  --gray-900: #171717;
  --gray-950: #0A0A0A;

  /* ── Semantic Light Theme ───────────────────────────────── */
  --bg-primary:    #F8F7F4;
  --bg-secondary:  #FFFFFF;
  --bg-tertiary:   #F1F0EC;
  --bg-elevated:   #FFFFFF;
  --bg-overlay:    rgba(0, 0, 0, 0.5);
  --bg-glass:      rgba(255, 255, 255, 0.72);
  --bg-glass-dark: rgba(255, 255, 255, 0.85);

  --text-primary:   #171717;
  --text-secondary: #525252;
  --text-tertiary:  #737373;
  --text-inverse:   #FFFFFF;
  --text-link:      #4F46E5;
  --text-accent:    #D97706;

  --border-light:   #E5E5E5;
  --border-default: #D4D4D4;
  --border-focus:   #4F46E5;

  --shadow-xs:  0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:  0 4px 6px rgba(0,0,0,0.05), 0 2px 4px rgba(0,0,0,0.04);
  --shadow-lg:  0 10px 15px rgba(0,0,0,0.06), 0 4px 6px rgba(0,0,0,0.04);
  --shadow-xl:  0 20px 25px rgba(0,0,0,0.08), 0 8px 10px rgba(0,0,0,0.04);
  --shadow-2xl: 0 25px 50px rgba(0,0,0,0.12);
  --shadow-glow: 0 0 20px rgba(99, 102, 241, 0.15);

  /* ── Typography ─────────────────────────────────────────── */
  --font-sans:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-display: 'Outfit', 'Inter', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', monospace;

  --text-xs:   0.75rem;    /* 12px */
  --text-sm:   0.8125rem;  /* 13px */
  --text-base: 0.9375rem;  /* 15px */
  --text-md:   1rem;       /* 16px */
  --text-lg:   1.125rem;   /* 18px */
  --text-xl:   1.25rem;    /* 20px */
  --text-2xl:  1.5rem;     /* 24px */
  --text-3xl:  1.875rem;   /* 30px */
  --text-4xl:  2.25rem;    /* 36px */
  --text-5xl:  3rem;       /* 48px */

  --leading-tight:  1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.625;

  --tracking-tight:  -0.02em;
  --tracking-normal:  0;
  --tracking-wide:    0.025em;

  /* ── Spacing ────────────────────────────────────────────── */
  --space-0:  0;
  --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 */

  /* ── Border Radius ──────────────────────────────────────── */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-xl:   18px;
  --radius-2xl:  24px;
  --radius-full: 9999px;

  /* ── Transitions ────────────────────────────────────────── */
  --ease-default: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-in:      cubic-bezier(0.4, 0, 1, 1);
  --ease-out:     cubic-bezier(0, 0, 0.2, 1);
  --ease-bounce:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-spring:  cubic-bezier(0.175, 0.885, 0.32, 1.275);

  --duration-fast:   150ms;
  --duration-normal: 250ms;
  --duration-slow:   400ms;

  /* ── Z-Index Scale ──────────────────────────────────────── */
  --z-dropdown:  100;
  --z-sticky:    200;
  --z-fixed:     300;
  --z-modal-bg:  400;
  --z-modal:     500;
  --z-popover:   600;
  --z-tooltip:   700;
  --z-toast:     800;
  --z-max:       999;

  /* ── Layout ─────────────────────────────────────────────── */
  --header-height: 60px;
  --nav-height:    64px;
  --sidebar-width: 280px;
  --max-width:     1400px;
  --content-width: 800px;

  /* ── Gradients ──────────────────────────────────────────── */
  --gradient-primary: linear-gradient(135deg, #6366F1 0%, #4F46E5 50%, #4338CA 100%);
  --gradient-accent:  linear-gradient(135deg, #F59E0B 0%, #F97316 100%);
  --gradient-saffron: linear-gradient(135deg, #FB923C 0%, #F97316 50%, #EA580C 100%);
  --gradient-warm:    linear-gradient(135deg, #6366F1 0%, #A855F7 50%, #EC4899 100%);
  --gradient-success: linear-gradient(135deg, #10B981 0%, #059669 100%);
  --gradient-danger:  linear-gradient(135deg, #EF4444 0%, #DC2626 100%);
  --gradient-hero:    linear-gradient(135deg, #312E81 0%, #4F46E5 40%, #6366F1 70%, #818CF8 100%);
  --gradient-card:    linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);
}

/* ── Dark Theme ──────────────────────────────────────────── */
[data-theme="dark"] {
  --bg-primary:    #0F172A;
  --bg-secondary:  #1E293B;
  --bg-tertiary:   #162033;
  --bg-elevated:   #1E293B;
  --bg-overlay:    rgba(0, 0, 0, 0.7);
  --bg-glass:      rgba(30, 41, 59, 0.72);
  --bg-glass-dark: rgba(15, 23, 42, 0.85);

  --text-primary:   #F1F5F9;
  --text-secondary: #94A3B8;
  --text-tertiary:  #64748B;
  --text-inverse:   #0F172A;
  --text-link:      #818CF8;
  --text-accent:    #FBBF24;

  --border-light:   #1E293B;
  --border-default: #334155;
  --border-focus:   #818CF8;

  --shadow-xs:  0 1px 2px rgba(0,0,0,0.2);
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.2);
  --shadow-md:  0 4px 6px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.2);
  --shadow-lg:  0 10px 15px rgba(0,0,0,0.3), 0 4px 6px rgba(0,0,0,0.2);
  --shadow-xl:  0 20px 25px rgba(0,0,0,0.35), 0 8px 10px rgba(0,0,0,0.2);
  --shadow-2xl: 0 25px 50px rgba(0,0,0,0.4);
  --shadow-glow: 0 0 20px rgba(129, 140, 248, 0.2);

  --gradient-card: linear-gradient(180deg, rgba(30,41,59,0) 0%, rgba(30,41,59,0.8) 100%);

  /* Semantic Soft Backgrounds (Dark Mode Overrides) */
  --primary-50:  rgba(99, 102, 241, 0.15);
  --accent-50:   rgba(245, 158, 11, 0.15);
  --saffron-50:  rgba(249, 115, 22, 0.15);
  --success-50:  rgba(16, 185, 129, 0.15);
  --danger-50:   rgba(239, 68, 68, 0.15);
  --warning-50:  rgba(234, 179, 8, 0.15);
  --info-50:     rgba(6, 182, 212, 0.15);
}