/**
 * Estilos de Red Salud
 * Color principal: #ff1c22 (rojo Red Salud)
 */

/* Variables CSS personalizadas para Red Salud */
.red-salud-theme {
    --rs-primary: #ff1c22;
    --rs-primary-dark: #d91419;
    --rs-primary-light: #ff4d52;
    --rs-primary-lighter: #fef2f2;
    --rs-primary-hover: #e6181e;
}

/* Sobrescribir colores de texto primary */
.red-salud-theme .text-primary {
    color: var(--rs-primary) !important;
}

.red-salud-theme .hover\:text-primary:hover {
    color: var(--rs-primary) !important;
}

.red-salud-theme .group:hover .group-hover\:text-primary {
    color: var(--rs-primary) !important;
}

/* Sobrescribir colores de fondo primary */
.red-salud-theme .bg-primary {
    background-color: var(--rs-primary) !important;
}

.red-salud-theme .bg-primary\/10 {
    background-color: var(--rs-primary-lighter) !important;
}

.red-salud-theme .hover\:bg-primary:hover {
    background-color: var(--rs-primary) !important;
}

.red-salud-theme .hover\:bg-primary-dark:hover,
.red-salud-theme .bg-primary-dark {
    background-color: var(--rs-primary-dark) !important;
}

/* Gradientes */
.red-salud-theme .from-primary {
    --tw-gradient-from: var(--rs-primary) !important;
    --tw-gradient-to: rgb(255 28 34 / 0) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.red-salud-theme .to-primary-dark {
    --tw-gradient-to: var(--rs-primary-dark) !important;
}

.red-salud-theme .from-red-50 {
    --tw-gradient-from: var(--rs-primary-lighter) !important;
}

/* Hero section - fondo rojo suave */
.red-salud-theme .hero-bg {
    background: linear-gradient(135deg, #fef2f2 0%, #ffffff 50%, #fef2f2 100%);
}

.red-salud-theme.dark .hero-bg {
    background: linear-gradient(135deg, #1a0d0d 0%, #101922 50%, #1a0d0d 100%);
}

/* Badges y pills */
.red-salud-theme .bg-red-100 {
    background-color: var(--rs-primary-lighter) !important;
}

.red-salud-theme .text-red-700 {
    color: var(--rs-primary-dark) !important;
}

/* Bordes */
.red-salud-theme .border-primary\/40 {
    border-color: rgb(255 28 34 / 0.4) !important;
}

.red-salud-theme .hover\:border-primary\/40:hover {
    border-color: rgb(255 28 34 / 0.4) !important;
}

/* Hover states para fondos */
.red-salud-theme .hover\:bg-red-50:hover,
.red-salud-theme .hover\:bg-blue-50:hover {
    background-color: var(--rs-primary-lighter) !important;
}

/* Sombras */
.red-salud-theme .shadow-primary\/30 {
    --tw-shadow-color: rgb(255 28 34 / 0.3) !important;
    --tw-shadow: var(--tw-shadow-colored) !important;
}

/* CTA Section con degradado rojo */
.red-salud-theme .cta-gradient {
    background: linear-gradient(90deg, var(--rs-primary) 0%, var(--rs-primary-dark) 100%);
}

/* Text colors para CTA */
.red-salud-theme .text-blue-100 {
    color: rgba(254, 242, 242, 0.9) !important;
}

/* Iconos en el header dropdown - excluidos del override del navbar */
.red-salud-theme .material-symbols-outlined.text-primary {
    color: var(--rs-primary) !important;
}

/* Estados hover para links y botones */
.red-salud-theme a:hover .text-primary,
.red-salud-theme button:hover .text-primary {
    color: var(--rs-primary-hover) !important;
}

/* Badge de cantidad de clínicas */
.red-salud-theme .bg-primary\/10.text-primary {
    background-color: var(--rs-primary-lighter) !important;
    color: var(--rs-primary-dark) !important;
}

/* Fix para el botón blanco en CTA */
.red-salud-theme .bg-white.text-primary {
    background-color: white !important;
    color: var(--rs-primary) !important;
}

.red-salud-theme .bg-white.text-primary:hover {
    background-color: var(--rs-primary-lighter) !important;
}

/* Modo oscuro - ajustes de contraste */
.red-salud-theme.dark .text-primary {
    color: var(--rs-primary-light) !important;
}

.red-salud-theme.dark .bg-primary {
    background-color: var(--rs-primary-light) !important;
}

/* Asegurar que el navbar NO se vea afectado por el theme */
header .text-primary,
#mobile-nav .text-primary {
    color: #111418 !important;
}
.dark header .text-primary,
.dark #mobile-nav .text-primary {
    color: #ffffff !important;
}
