/* =========================================
   MiniTiendAI — Theme Overrides
   Loaded after tokens.css on every page.
   Each theme overrides the primary color family.
   ========================================= */

.theme-modern {
  --primary-color: #3b82f6;
  --primary-dark: #2563eb;
  --primary-light: #60a5fa;
  --primary-text: #ffffff;
  --gradient: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
  --primary-gradient: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
  --shadow-primary: 0 10px 40px -10px rgba(59, 130, 246, 0.5);
  --primary-glow: rgba(59, 130, 246, 0.35);
  --primary-color-light: rgba(59, 130, 246, 0.1);
}

.theme-dark {
  --primary-color: #047857;
  --primary-dark: #065f46;
  --primary-light: #10b981;
  --primary-text: #ffffff;
  --gradient: linear-gradient(135deg, #047857 0%, #10b981 100%);
  --primary-gradient: linear-gradient(135deg, #047857 0%, #10b981 100%);
  --shadow-primary: 0 10px 40px -10px rgba(4, 120, 87, 0.5);
  --primary-glow: rgba(4, 120, 87, 0.35);
  --primary-color-light: rgba(4, 120, 87, 0.1);
}

.theme-purple {
  --primary-color: #8b5cf6;
  --primary-dark: #7c3aed;
  --primary-light: #a78bfa;
  --primary-text: #ffffff;
  --gradient: linear-gradient(135deg, #8b5cf6 0%, #c084fc 100%);
  --primary-gradient: linear-gradient(135deg, #8b5cf6 0%, #c4b5fd 100%);
  --shadow-primary: 0 10px 40px -10px rgba(139, 92, 246, 0.5);
  --primary-glow: rgba(139, 92, 246, 0.35);
  --primary-color-light: rgba(139, 92, 246, 0.1);
}

.theme-orange {
  --primary-color: #f97316;
  --primary-dark: #ea580c;
  --primary-light: #fb923c;
  --primary-text: #1e293b;
  --primary-text-on-light: #9a3412;
  --gradient: linear-gradient(135deg, #f97316 0%, #fb923c 100%);
  --primary-gradient: linear-gradient(135deg, #f97316 0%, #fcd34d 100%);
  --shadow-primary: 0 10px 40px -10px rgba(249, 115, 22, 0.5);
  --primary-glow: rgba(249, 115, 22, 0.35);
  --primary-color-light: rgba(249, 115, 22, 0.1);
}

.theme-pink {
  --primary-color: #ec4899;
  --primary-dark: #db2777;
  --primary-light: #f472b6;
  --primary-text: #ffffff;
  --gradient: linear-gradient(135deg, #ec4899 0%, #f472b6 100%);
  --primary-gradient: linear-gradient(135deg, #ec4899 0%, #f9a8d4 100%);
  --shadow-primary: 0 10px 40px -10px rgba(236, 72, 153, 0.5);
  --primary-glow: rgba(236, 72, 153, 0.35);
  --primary-color-light: rgba(236, 72, 153, 0.1);
}

.theme-cyan {
  --primary-color: #0e7490;
  --primary-dark: #155e75;
  --primary-light: #06b6d4;
  --primary-text: #ffffff;
  --gradient: linear-gradient(135deg, #0e7490 0%, #06b6d4 100%);
  --primary-gradient: linear-gradient(135deg, #0e7490 0%, #22d3ee 100%);
  --shadow-primary: 0 10px 40px -10px rgba(14, 116, 144, 0.5);
  --primary-glow: rgba(14, 116, 144, 0.35);
  --primary-color-light: rgba(14, 116, 144, 0.1);
}

.theme-yellow {
  --primary-color: #eab308;
  --primary-dark: #ca8a04;
  --primary-light: #facc15;
  --primary-text: #1e293b;
  --primary-text-on-light: #92400e;
  --gradient: linear-gradient(135deg, #eab308 0%, #facc15 100%);
  --primary-gradient: linear-gradient(135deg, #eab308 0%, #fef08a 100%);
  --shadow-primary: 0 10px 40px -10px rgba(234, 179, 8, 0.5);
  --primary-glow: rgba(234, 179, 8, 0.35);
  --primary-color-light: rgba(234, 179, 8, 0.1);
}

.theme-lime {
  --primary-color: #84cc16;
  --primary-dark: #65a30d;
  --primary-light: #a3e635;
  --primary-text: #1e293b;
  --primary-text-on-light: #3f6212;
  --gradient: linear-gradient(135deg, #84cc16 0%, #a3e635 100%);
  --primary-gradient: linear-gradient(135deg, #84cc16 0%, #d9f99d 100%);
  --shadow-primary: 0 10px 40px -10px rgba(132, 204, 22, 0.5);
  --primary-glow: rgba(132, 204, 22, 0.35);
  --primary-color-light: rgba(132, 204, 22, 0.1);
}

.theme-rose {
  --primary-color: #f43f5e;
  --primary-dark: #e11d48;
  --primary-light: #fb7185;
  --primary-text: #ffffff;
  --gradient: linear-gradient(135deg, #f43f5e 0%, #fb7185 100%);
  --primary-gradient: linear-gradient(135deg, #f43f5e 0%, #fda4af 100%);
  --shadow-primary: 0 10px 40px -10px rgba(244, 63, 94, 0.5);
  --primary-glow: rgba(244, 63, 94, 0.35);
  --primary-color-light: rgba(244, 63, 94, 0.1);
}

.theme-indigo {
  --primary-color: #6366f1;
  --primary-dark: #4f46e5;
  --primary-light: #818cf8;
  --primary-text: #ffffff;
  --gradient: linear-gradient(135deg, #6366f1 0%, #818cf8 100%);
  --primary-gradient: linear-gradient(135deg, #6366f1 0%, #a78bfa 100%);
  --shadow-primary: 0 10px 40px -10px rgba(99, 102, 241, 0.5);
  --primary-glow: rgba(99, 102, 241, 0.35);
  --primary-color-light: rgba(99, 102, 241, 0.1);
}