/* =========================================
   PINK GRADIENT THEMES
   ========================================= */

/* 1. Degradado Rosa-Rojo Intenso */
body.gradient-rose-red-mode {
    --bg-primary: #fff0f5;
    --bg-secondary: #ffffff;
    --text-primary: #881337;
    --text-secondary: #9f1239;
    --border-color: #fecdd3;
    --shadow-color: rgba(136, 19, 55, 0.1);
    --shadow-hover: rgba(136, 19, 55, 0.2);
    --sidebar-bg: linear-gradient(135deg, #e11d48 0%, #be123c 100%);
    --sidebar-text: #ffffff;
    --sidebar-hover-bg: rgba(255, 255, 255, 0.2);
    --sidebar-active-bg: #881337;
    --sidebar-border: #fda4af;
    --input-bg: #fff1f2;
    --input-border: #fecdd3;
    --input-focus-shadow: rgba(225, 29, 72, 0.3);
    --primary-gradient-start: #e11d48;
    --primary-gradient-end: #be123c;
    --primary-gradient-hover-start: #be123c;
    --primary-gradient-hover-end: #e11d48;
    --danger-color: #ef4444;
    --danger-hover-color: #dc2626;
    --success-color: #22c55e;
    --success-hover-color: #16a34a;
    --info-color: #3b82f6;
    --info-hover-color: #2563eb;
    --footer-bg: #881337;
    --footer-text-primary: #ffffff;
    --footer-text-secondary: #fff1f2;
    --footer-border: #9f1239;
    --footer-icon-color: #fff1f2;
}

/* 2. Degradado Rosa-Rojo */
body.gradient-pink-red-mode {
    --bg-primary: #fff1f2;
    --bg-secondary: #ffffff;
    --text-primary: #be123c;
    --text-secondary: #e11d48;
    --border-color: #fda4af;
    --shadow-color: rgba(190, 18, 60, 0.1);
    --shadow-hover: rgba(190, 18, 60, 0.2);
    --sidebar-bg: linear-gradient(135deg, #ec4899 0%, #ef4444 100%);
    --sidebar-text: #ffffff;
    --sidebar-hover-bg: rgba(255, 255, 255, 0.2);
    --sidebar-active-bg: #9f1239;
    --sidebar-border: #fca5a5;
    --input-bg: #fff5f7;
    --input-border: #fda4af;
    --input-focus-shadow: rgba(236, 72, 153, 0.3);
    --primary-gradient-start: #ec4899;
    --primary-gradient-end: #ef4444;
    --primary-gradient-hover-start: #ef4444;
    --primary-gradient-hover-end: #ec4899;
    --danger-color: #dc2626;
    --danger-hover-color: #b91c1c;
    --success-color: #16a34a;
    --success-hover-color: #15803d;
    --info-color: #2563eb;
    --info-hover-color: #1d4ed8;
    --footer-bg: #9f1239;
    --footer-text-primary: #ffffff;
    --footer-text-secondary: #ffe4e6;
    --footer-border: #be123c;
    --footer-icon-color: #ffe4e6;
}

/* 3. Degradado Carmesí-Rosa */
body.gradient-crimson-pink-mode {
    --bg-primary: #fff0f5;
    --bg-secondary: #ffffff;
    --text-primary: #9d174d;
    --text-secondary: #be185d;
    --border-color: #fbcfe8;
    --shadow-color: rgba(157, 23, 77, 0.1);
    --shadow-hover: rgba(157, 23, 77, 0.2);
    --sidebar-bg: linear-gradient(135deg, #dc2626 0%, #db2777 100%);
    --sidebar-text: #ffffff;
    --sidebar-hover-bg: rgba(255, 255, 255, 0.2);
    --sidebar-active-bg: #831843;
    --sidebar-border: #f9a8d4;
    --input-bg: #fdf2f8;
    --input-border: #fbcfe8;
    --input-focus-shadow: rgba(219, 39, 119, 0.3);
    --primary-gradient-start: #dc2626;
    --primary-gradient-end: #db2777;
    --primary-gradient-hover-start: #db2777;
    --primary-gradient-hover-end: #dc2626;
    --danger-color: #b91c1c;
    --danger-hover-color: #991b1b;
    --success-color: #15803d;
    --success-hover-color: #166534;
    --info-color: #1d4ed8;
    --info-hover-color: #1e40af;
    --footer-bg: #831843;
    --footer-text-primary: #ffffff;
    --footer-text-secondary: #fce7f3;
    --footer-border: #9d174d;
    --footer-icon-color: #fce7f3;
}

/* 4. Degradado Rosa-Magenta */
body.gradient-pink-magenta-mode {
    --bg-primary: #fdf2f8;
    --bg-secondary: #ffffff;
    --text-primary: #831843;
    --text-secondary: #9d174d;
    --border-color: #fbcfe8;
    --shadow-color: rgba(131, 24, 67, 0.1);
    --shadow-hover: rgba(131, 24, 67, 0.2);
    --sidebar-bg: linear-gradient(135deg, #ec4899 0%, #c026d3 100%);
    --sidebar-text: #ffffff;
    --sidebar-hover-bg: rgba(255, 255, 255, 0.2);
    --sidebar-active-bg: #701a75;
    --sidebar-border: #e879f9;
    --input-bg: #fae8ff;
    --input-border: #f0abfc;
    --input-focus-shadow: rgba(192, 38, 211, 0.3);
    --primary-gradient-start: #ec4899;
    --primary-gradient-end: #c026d3;
    --primary-gradient-hover-start: #c026d3;
    --primary-gradient-hover-end: #ec4899;
    --danger-color: #be123c;
    --danger-hover-color: #9f1239;
    --success-color: #15803d;
    --success-hover-color: #166534;
    --info-color: #1d4ed8;
    --info-hover-color: #1e40af;
    --footer-bg: #701a75;
    --footer-text-primary: #ffffff;
    --footer-text-secondary: #fae8ff;
    --footer-border: #86198f;
    --footer-icon-color: #fae8ff;
}

/* 5. Degradado Rosa Profundo */
body.gradient-deep-pink-mode {
    --bg-primary: #fce7f3;
    --bg-secondary: #ffffff;
    --text-primary: #831843;
    --text-secondary: #9d174d;
    --border-color: #fbcfe8;
    --shadow-color: rgba(131, 24, 67, 0.1);
    --shadow-hover: rgba(131, 24, 67, 0.2);
    --sidebar-bg: linear-gradient(135deg, #db2777 0%, #be185d 100%);
    --sidebar-text: #ffffff;
    --sidebar-hover-bg: rgba(255, 255, 255, 0.2);
    --sidebar-active-bg: #500724;
    --sidebar-border: #f9a8d4;
    --input-bg: #fdf2f8;
    --input-border: #fbcfe8;
    --input-focus-shadow: rgba(219, 39, 119, 0.3);
    --primary-gradient-start: #db2777;
    --primary-gradient-end: #be185d;
    --primary-gradient-hover-start: #be185d;
    --primary-gradient-hover-end: #db2777;
    --danger-color: #9f1239;
    --danger-hover-color: #881337;
    --success-color: #166534;
    --success-hover-color: #14532d;
    --info-color: #1e40af;
    --info-hover-color: #1e3a8a;
    --footer-bg: #500724;
    --footer-text-primary: #ffffff;
    --footer-text-secondary: #fce7f3;
    --footer-border: #831843;
    --footer-icon-color: #fce7f3;
}

/* 6. Degradado Rosa Caliente */
body.gradient-hot-pink-mode {
    --bg-primary: #fff0f5;
    --bg-secondary: #ffffff;
    --text-primary: #be185d;
    --text-secondary: #db2777;
    --border-color: #fbcfe8;
    --shadow-color: rgba(190, 24, 93, 0.1);
    --shadow-hover: rgba(190, 24, 93, 0.2);
    --sidebar-bg: linear-gradient(135deg, #ff69b4 0%, #db2777 100%);
    --sidebar-text: #ffffff;
    --sidebar-hover-bg: rgba(255, 255, 255, 0.2);
    --sidebar-active-bg: #831843;
    --sidebar-border: #f9a8d4;
    --input-bg: #fdf2f8;
    --input-border: #fbcfe8;
    --input-focus-shadow: rgba(255, 105, 180, 0.3);
    --primary-gradient-start: #ff69b4;
    --primary-gradient-end: #db2777;
    --primary-gradient-hover-start: #db2777;
    --primary-gradient-hover-end: #ff69b4;
    --danger-color: #be123c;
    --danger-hover-color: #9f1239;
    --success-color: #15803d;
    --success-hover-color: #166534;
    --info-color: #1d4ed8;
    --info-hover-color: #1e40af;
    --footer-bg: #831843;
    --footer-text-primary: #ffffff;
    --footer-text-secondary: #fce7f3;
    --footer-border: #9d174d;
    --footer-icon-color: #fce7f3;
}

/* =========================================
   FRONTEND OVERRIDES FOR TAILWIND CLASSES
   ========================================= */

/* Apply theme colors to Tailwind classes when a gradient theme is active */
body[class*="gradient-"] .bg-indigo-900,
body[class*="gradient-"] .bg-gray-900,
body[class*="gradient-"] .bg-slate-900,
body[class*="gradient-"] .bg-blue-900 {
    background: var(--sidebar-bg) !important;
    border-color: var(--sidebar-border) !important;
}

/* Navbar text and icons */
body[class*="gradient-"] .text-indigo-600,
body[class*="gradient-"] .text-blue-600,
body[class*="gradient-"] .text-indigo-500,
body[class*="gradient-"] .text-blue-500 {
    color: var(--primary-gradient-start) !important;
}

/* Light backgrounds */
body[class*="gradient-"] .bg-indigo-50,
body[class*="gradient-"] .bg-blue-50,
body[class*="gradient-"] .bg-gray-50 {
    background-color: var(--bg-primary) !important;
}

/* Text colors */
body[class*="gradient-"] .text-gray-800,
body[class*="gradient-"] .text-gray-900,
body[class*="gradient-"] .text-slate-800,
body[class*="gradient-"] .text-slate-900 {
    color: var(--text-primary) !important;
}

body[class*="gradient-"] .text-gray-600,
body[class*="gradient-"] .text-gray-700,
body[class*="gradient-"] .text-slate-600,
body[class*="gradient-"] .text-slate-700 {
    color: var(--text-secondary) !important;
}

/* Gradient Buttons */
body[class*="gradient-"] .gradient-btn {
    background: linear-gradient(135deg, var(--primary-gradient-start) 0%, var(--primary-gradient-end) 100%) !important;
    border: none !important;
}

body[class*="gradient-"] .gradient-btn:hover {
    background: linear-gradient(135deg, var(--primary-gradient-hover-start) 0%, var(--primary-gradient-hover-end) 100%) !important;
    box-shadow: 0 4px 15px var(--shadow-hover) !important;
}

/* Card backgrounds */
body[class*="gradient-"] .bg-white {
    background-color: var(--bg-secondary) !important;
    border: 1px solid var(--border-color);
}

/* Inputs and Forms */
body[class*="gradient-"] input,
body[class*="gradient-"] select,
body[class*="gradient-"] textarea {
    background-color: var(--input-bg) !important;
    border-color: var(--input-border) !important;
    color: var(--text-primary) !important;
}

body[class*="gradient-"] input:focus,
body[class*="gradient-"] select:focus,
body[class*="gradient-"] textarea:focus {
    box-shadow: 0 0 0 3px var(--input-focus-shadow) !important;
    border-color: var(--primary-gradient-start) !important;
}

/* Specific overrides for specific themes if needed */
body[class*="gradient-pink-"] .text-indigo-200 {
    color: rgba(255, 255, 255, 0.8) !important;
}