/* Tema claro minimalista para toda la página */

/* Estilos globales */
body.light-theme {
    background-color: #ffffff !important;
    color: #333333 !important;
}

/* Títulos en color oscuro para contraste */
.light-theme h1, 
.light-theme h2, 
.light-theme h3, 
.light-theme h4, 
.light-theme h5, 
.light-theme h6 {
    color: #1a1a1a !important;
}

/* Párrafos y texto general */
.light-theme p {
    color: #555555 !important;
}

/* FOOTER: NO CAMBIAR NADA - Mantener diseño original del footer-modern.css */
/* El footer debe verse EXACTAMENTE igual en ambos temas */

/* Asegurar que los títulos del footer sean blancos en modo claro */
.light-theme footer h4,
.light-theme .footer-social h4,
.light-theme .footer-contact h4,
.light-theme .footer-links h4 {
    color: #fff !important;
}

/* Mantener todos los textos del footer como en el diseño original */
.light-theme .footer-logo {
    color: #fff !important;
}

.light-theme .footer-logo span {
    color: #ed563b !important;
}

.light-theme .footer-description {
    color: rgba(255, 255, 255, 0.7) !important;
}

.light-theme .footer-contact-item,
.light-theme .footer-contact-item span {
    color: rgba(255, 255, 255, 0.8) !important;
}

.light-theme .footer-links ul li a {
    color: rgba(255, 255, 255, 0.7) !important;
}

.light-theme .copyright {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* Header con fondo blanco */
.light-theme header {
    background-color: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(10px) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
}

.light-theme header.background-header {
    background-color: #ffffff !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1) !important;
}

/* Logo en el header */
.light-theme .header-area .main-nav .logo {
    color: #1a1a1a !important;
}

/* Menú de navegación */
.light-theme .header-area .main-nav .nav li a {
    color: #555555 !important;
}

.light-theme .header-area .main-nav .nav li a:hover {
    color: #d32f2f !important;
}


/* Banner principal */
.light-theme .main-banner {
    background-color: #f8f9fa !important;
}

.light-theme .main-banner .left-content h1,
.light-theme .main-banner .left-content h2,
.light-theme .main-banner .left-content h6 {
    color: #1a1a1a !important;
}

/* Mantener elementos em en rojo siempre */
.main-banner .left-content h1 em,
.main-banner .left-content h2 em {
    color: #d32f2f !important;
}

/* Botones principales - cambio de naranja a rojo */
.main-button a,
.btn-primary,
button[type="submit"],
.submit-button {
    background: linear-gradient(135deg, #d32f2f 0%, #f44336 100%) !important;
    box-shadow: 0 4px 15px rgba(211, 47, 47, 0.3) !important;
}

.main-button a:hover,
.btn-primary:hover,
button[type="submit"]:hover,
.submit-button:hover {
    box-shadow: 0 8px 25px rgba(211, 47, 47, 0.4) !important;
}

/* Sección de features */
.light-theme #features {
    background-color: #ffffff !important;
}

.light-theme .feature-item {
    background-color: #ffffff !important;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08) !important;
    border: 1px solid #f0f0f0 !important;
}

.light-theme .feature-item:hover {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
}

.light-theme .feature-item h4 {
    color: #1a1a1a !important;
}

.light-theme .feature-item p {
    color: #666666 !important;
}

/* Mantener iconos rojos */
.feature-item .icon {
    background-color: #d32f2f !important;
}

/* Sección CTA */
.light-theme .cta-section {
    background-color: #f8f9fa !important;
}

.light-theme .cta-content h2 {
    color: #1a1a1a !important;
}

/* Mantener em en rojo */
.cta-content h2 em {
    color: #d32f2f !important;
}

.light-theme .cta-content p {
    color: #666666 !important;
}

/* Sección de horarios */
.light-theme #schedule {
    background-color: #ffffff !important;
}

.light-theme #schedule .section-heading h2 {
    color: #1a1a1a !important;
}

/* Asegurar que todo el texto del h2 sea negro excepto em */
.light-theme #schedule h2 {
    color: #1a1a1a !important;
}

/* Mantener em en rojo */
#schedule .section-heading h2 em {
    color: #d32f2f !important;
}

/* Filtros de horario */
.light-theme .schedule-filter li {
    background: #f8f9fa !important;
    color: #555555 !important;
    border: 1px solid #e0e0e0 !important;
}

.light-theme .schedule-filter li:hover {
    border-color: #d32f2f !important;
    color: #d32f2f !important;
}

/* Mantener activo en rojo */
.schedule-filter li.active {
    background: #d32f2f !important;
    color: #ffffff !important;
    border-color: #d32f2f !important;
}

/* Tarjetas de horario */
.light-theme .schedule-card {
    background: #ffffff !important;
    border: 1px solid #f0f0f0 !important;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08) !important;
}

.light-theme .schedule-card:hover {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15) !important;
}

.light-theme .schedule-card h3 {
    color: #1a1a1a !important;
}

/* Mantener time-badge rojo */
.time-badge {
    background: linear-gradient(135deg, #d32f2f 0%, #f44336 100%) !important;
}

/* Sección de clases */
.light-theme #our-classes {
    background-color: #ffffff !important;
}

.light-theme #our-classes .section-heading h2 {
    color: #1a1a1a !important;
}

/* Mantener em en rojo */
#our-classes .section-heading h2 em {
    color: #d32f2f !important;
}

/* Tabs de clases */
.light-theme #tabs ul li a {
    background: #ffffff !important;
    color: #555555 !important;
    border: 1px solid #e0e0e0 !important;
}

.light-theme #tabs ul li a:hover {
    border-color: #d32f2f !important;
    color: #d32f2f !important;
}

/* Mantener tab activo en rojo */
#tabs ul li a.ui-tabs-active {
    background: linear-gradient(135deg, #d32f2f 0%, #f44336 100%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

/* Contenido de clases */
.light-theme .tabs-content article {
    background: #ffffff !important;
}

.light-theme .tabs-content article h4 {
    color: #1a1a1a !important;
}

.light-theme .tabs-content article p {
    color: #666666 !important;
}

/* Galería */
.light-theme #gallery {
    background-color: #ffffff !important;
}

.light-theme #gallery .section-heading h2 {
    color: #1a1a1a !important;
}

/* Asegurar que todo el texto del h2 de galería sea negro en tema claro */
.light-theme #gallery h2 {
    color: #1a1a1a !important;
}

/* Mantener em en rojo */
#gallery .section-heading h2 em {
    color: #d32f2f !important;
}

.light-theme #gallery .section-heading p {
    color: #666666 !important;
}

/* Items de galería */
.light-theme .gallery-item-modern {
    background: #f8f9fa !important;
    border: 1px solid #e0e0e0 !important;
}

/* Mantener expand en rojo */
.gallery-expand {
    background: rgba(211, 47, 47, 0.9) !important;
}

/* Sección de contacto */
.light-theme #contact {
    background-color: #f8f9fa !important;
}

.light-theme #contact .section-heading h2 {
    color: #1a1a1a !important;
}

/* Mantener em en rojo */
#contact .section-heading h2 em {
    color: #d32f2f !important;
}

/* Contenido de contacto */
.light-theme .contact-content {
    background: #ffffff !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08) !important;
    border: none !important;
}

/* Items de información */
.light-theme .info-item {
    background: #f8f9fa !important;
    border: 1px solid #e0e0e0 !important;
}

.light-theme .info-item:hover {
    box-shadow: 0 5px 20px rgba(211, 47, 47, 0.1) !important;
    border-color: #d32f2f !important;
}

/* Mantener iconos en rojo */
.info-item i {
    color: #d32f2f !important;
    background: rgba(211, 47, 47, 0.1) !important;
}

.light-theme .info-item .info-content h4 {
    color: #1a1a1a !important;
}

.light-theme .info-item .info-content p {
    color: #666666 !important;
}

/* Formulario de contacto */
.light-theme .contact-form {
    background: #ffffff !important;
    border: 1px solid #f0f0f0 !important;
}

.light-theme .form-control {
    background: #f8f9fa !important;
    border: 2px solid #e0e0e0 !important;
    color: #333333 !important;
}

.light-theme .form-control:focus {
    border-color: #d32f2f !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(211, 47, 47, 0.1) !important;
}

.light-theme .form-control::placeholder {
    color: #999999 !important;
}

/* Texto legal */
.light-theme .legal-text {
    background: #f8f9fa !important;
    border: 1px solid #e0e0e0 !important;
    color: #666666 !important;
}

.light-theme .legal-text b {
    color: #333333 !important;
}

/* Checkbox */
.light-theme .custom-checkbox label {
    color: #666666 !important;
}

/* Mantener links en rojo */
.custom-checkbox a {
    color: #d32f2f !important;
}

/* Mantener checkbox en rojo */
.custom-checkbox input[type="checkbox"] {
    accent-color: #d32f2f !important;
}

/* Botón de envío */
.submit-button {
    background: linear-gradient(135deg, #d32f2f 0%, #f44336 100%) !important;
    box-shadow: 0 5px 20px rgba(211, 47, 47, 0.3) !important;
}

.submit-button:hover:not(:disabled) {
    box-shadow: 0 8px 30px rgba(211, 47, 47, 0.4) !important;
}

/* Mensajes del formulario */
.form-message.loading {
    background: rgba(33, 150, 243, 0.1) !important;
    border: 1px solid rgba(33, 150, 243, 0.3) !important;
    color: #1976d2 !important;
}

.form-message.error {
    background: rgba(244, 67, 54, 0.1) !important;
    border: 1px solid rgba(244, 67, 54, 0.3) !important;
    color: #d32828 !important;
}

.form-message.success {
    background: rgba(76, 175, 80, 0.1) !important;
    border: 1px solid rgba(76, 175, 80, 0.3) !important;
    color: #388e3c !important;
}

/* Call to action section */
.light-theme #call-to-action {
    background-color: #f8f9fa !important;
}

.light-theme #call-to-action h2 {
    color: #1a1a1a !important;
}

/* Mantener em en rojo */
#call-to-action h2 em {
    color: #d32f2f !important;
}

.light-theme #call-to-action p {
    color: #666666 !important;
}

/* Trainer section */
.light-theme #trainers {
    background-color: #ffffff !important;
}

.light-theme #trainers .section-heading h2 {
    color: #1a1a1a !important;
}

/* Mantener em en rojo */
#trainers .section-heading h2 em {
    color: #d32f2f !important;
}

/* Ajustes para el menú móvil */
@media (max-width: 991px) {
    /* FORZAR fondo negro para el menú móvil en tema claro */
    .light-theme .header-area .main-nav .nav.active {
        background: rgba(26, 26, 26, 0.98) !important;
        background-color: rgba(26, 26, 26, 0.98) !important;
    }
    
    /* Mantener los items del menú con fondo claro para contraste */
    .light-theme .header-area .main-nav .nav li a {
        background: rgba(255, 255, 255, 0.9) !important;
        color: #333333 !important;
    }
    
    .light-theme .header-area .main-nav .nav li a:hover {
        background: rgba(255, 255, 255, 1) !important;
        color: #d32f2f !important;
    }
    
    /* Mantener activo en rojo */
    .header-area .main-nav .nav li a.active {
        background: #d32f2f !important;
        color: #ffffff !important;
    }
    
    .light-theme .header-area .main-nav .menu-trigger {
        background: rgba(0, 0, 0, 0.05) !important;
        border: 2px solid rgba(0, 0, 0, 0.1) !important;
    }
    
    .light-theme .header-area .main-nav .menu-trigger span {
        background-color: #333333 !important;
    }
    
    .light-theme .header-area .main-nav .menu-trigger:hover {
        border-color: #d32f2f !important;
    }
    
    .light-theme .header-area .main-nav .menu-trigger:hover span {
        background-color: #d32f2f !important;
    }
    
    /* Mantener activo en rojo */
    .header-area .main-nav .menu-trigger.active {
        background: #d32f2f !important;
        border-color: #d32f2f !important;
    }
    
    .header-area .main-nav .menu-trigger.active span {
        background-color: #ffffff !important;
    }
}

/* Ajuste para el overlay del mapa */
.light-theme .map-overlay {
    background: linear-gradient(to top, #f8f9fa 0%, transparent 100%) !important;
}

/* Ajuste para labels flotantes */
.light-theme .form-floating label {
    background: #ffffff !important;
    color: #999999 !important;
}

/* Back to top button - mantener en rojo */
.back-to-top {
    background: #d32f2f !important;
    box-shadow: 0 5px 20px rgba(211, 47, 47, 0.4) !important;
}

.back-to-top:hover {
    box-shadow: 0 10px 30px rgba(211, 47, 47, 0.5) !important;
}

/* Asegurar que en tema oscuro los títulos sean blancos */
.dark-theme h1,
.dark-theme h2,
.dark-theme h3,
.dark-theme h4,
.dark-theme h5,
.dark-theme h6 {
    color: #ffffff !important;
}

/* Asegurar específicamente que los h2 de las secciones sean blancos en tema oscuro */
.dark-theme .section-heading h2,
.dark-theme #gallery .section-heading h2,
.dark-theme #schedule .section-heading h2,
.dark-theme #our-classes .section-heading h2,
.dark-theme #contact .section-heading h2 {
    color: #ffffff !important;
}

/* Forzar que TODO el contenido de texto en h2 sea blanco en tema oscuro */
body:not(.light-theme) .section-heading h2,
body:not(.light-theme) #gallery h2,
body:not(.light-theme) #schedule h2 {
    color: #ffffff !important;
}

/* Mantener párrafos claros en tema oscuro */
.dark-theme p {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* REGLAS FINALES PARA TÍTULOS */
/* Por defecto (tema oscuro) - todos los h2 blancos */
#gallery .section-heading h2,
#schedule .section-heading h2,
#our-classes .section-heading h2,
#contact .section-heading h2 {
    color: #ffffff;
}

/* Tema claro - h2 negros */
.light-theme #gallery .section-heading h2,
.light-theme #schedule .section-heading h2,
.light-theme #our-classes .section-heading h2,
.light-theme #contact .section-heading h2 {
    color: #1a1a1a !important;
}

/* Em siempre rojo en ambos temas */
.section-heading h2 em {
    color: #d32f2f !important;
    font-style: normal !important;
}

/* BOTÓN ACTIVO DEL MENÚ - Rojo en ambos temas */
.header-area .main-nav .nav li a.active {
    background: linear-gradient(135deg, #d32f2f 0%, #f44336 100%) !important;
    color: #ffffff !important;
    padding: 8px 20px !important;
    border-radius: 20px !important;
    margin: 0 5px !important;
    transition: all 0.3s ease !important;
}

.header-area .main-nav .nav li a.active:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 5px 15px rgba(211, 47, 47, 0.3) !important;
}

/* OVERRIDE FINAL - Asegurar fondo negro del menú móvil en tema claro */
@media (max-width: 991px) {
    body.light-theme .header-area .nav,
    body.light-theme .header-area .nav.active,
    .light-theme .header-area .nav,
    .light-theme .header-area .nav.active {
        background: rgba(26, 26, 26, 0.98) !important;
        background-color: rgba(26, 26, 26, 0.98) !important;
    }
}