/* ======================================================= */
/* === VARIABLES DE DISEÑO WEB 3.0 DARK === */
/* ======================================================= */
:root {
    /* Color Primario: Cían/Azul Eléctrico para acentos */
    --primary-color: #00eaff; 
    
    /* Fondos Oscuros */
    --color-background-deep: #0a1128; /* Azul marino muy oscuro (Fondo principal y Footer) */
    --color-background-header: #121831; /* Fondo de la barra de navegación */
    
    /* Colores de Glassmorphism */
    --color-glass-base: rgba(100, 140, 180, 0.15); /* Vidrio semi-transparente */
    --border-glass: 1px solid rgba(255, 255, 255, 0.25);
    
    /* Texto */
    --color-text-light: #ffffff;
    --color-text-subtle: #a0aec0;
    
    /* Bordes */
    --border-radius-lg: 20px;
    --border-radius-sm: 8px;
}

/* ======================================================= */
/* === ESTILOS GLOBALES Y DE TEXTO (FUERZA MÁXIMA) === */
/* ======================================================= */

body {
    background-color: var(--color-background-deep) !important;
    font-family: 'Inter', sans-serif, 'Helvetica Neue', Arial;
}

/* Forzar todo el texto a ser claro (Texto blanco para legibilidad) */
h1, h2, h3, h4, h5, h6, p, a, span, * {
    color: var(--color-text-light) !important;
}

/* Anular color de fondo blanco en todas las secciones/contenedores por defecto */
section, div {
    background-color: transparent !important;
}

/* ======================================================= */
/* === SECCIONES DE LA LANDING PAGE === */
/* ======================================================= */

/* Navbar (ud-header) */
.ud-header {
    background-color: var(--color-background-header) !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* Sección de Características */
.ud-about-wrapper {
    background-color: var(--color-background-deep) !important;
}
/* ======================================================= */
/* === CORRECCIÓN DE FOOTER (AJUSTE DE TAMAÑO) === */
/* ======================================================= */

/* Selector del contenedor principal del pie de página */
.ud-footer-wrapper, 
.ud-footer, 
.ud-footer-area, /* Agregamos un selector común de landing pages */
footer {
    background-color: var(--color-background-deep) !important;
    color: var(--color-text-light) !important;
    
    /* CLAVE: Aumentar el relleno (padding) para darle altura */
    padding-top: 60px !important; 
    padding-bottom: 60px !important; 
    
    /* Aseguramos que la caja tenga espacio para su contenido */
    min-height: 250px !important; 
}

.ud-footer-wrapper *, .ud-footer * {
    color: var(--color-text-light) !important;
}
/* ======================================================= */
/* === CORRECCIÓN DE FONDO CLARO (SECCIÓN DE CONTACTO/BLANCA) === */
/* ======================================================= */

/* CLAVE: Selector más amplio y agresivo para anular cualquier fondo claro en esa área. */
/* Asumiendo que esta sección es un div o section sin una clase específica de fondo. */
.ud-contact-wrapper, 
.ud-about-wrapper + section, 
div.container + section,
/* Agregamos el selector por defecto de Bootstrap para fondos claros y un selector genérico fuerte */
.bg-light, 
.bg-white, 
section.bg-light,
section[style*="background-color"],
div[style*="background-color"],
section,
div.container > div:not(.ud-header) {
    /* Forzamos el fondo oscuro principal, ¡anulando el blanco! */
    background-color: var(--color-background-deep) !important;
}


/* ======================================================= */
/* === CORRECCIÓN FAQ (PREGUNTAS FRECUENTES) CON GLASSMORPHISM === */
/* ======================================================= */

.ud-faq-item, 
.accordion-item,
.card,
/* Selector Genérico para la corrección visual de las cajas de respuesta */
div.container > div > div.col-lg-12 > div { 
    
    /* Aplicamos el fondo de vidrio oscuro */
    background-color: var(--color-glass-base) !important; 
    
    /* Estilo Web 3.0 */
    border: var(--border-glass) !important;
    border-radius: var(--border-radius-lg) !important; 
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    
    margin-bottom: 20px; 
    padding: 20px;
}

/* Asegurar que el fondo interno de la respuesta sea transparente */
.accordion-body, .card-body {
    background-color: transparent !important;
}


/* ======================================================= */
/* === BOTONES Y ELEMENTOS INTERACTIVOS === */
/* ======================================================= */

/* Botones / Call to Action (Cían Eléctrico) */
.btn-primary, .ud-main-btn {
    background-color: var(--primary-color) !important;
    color: #121831 !important; 
    font-weight: bold;
    border: none !important;
    border-radius: var(--border-radius-sm);
    box-shadow: 0 6px 15px rgba(0, 234, 255, 0.4);
    transition: all 0.3s ease;
}

.btn-primary:hover, .ud-main-btn:hover {
    background-color: #00b8d4 !important;
    box-shadow: 0 8px 20px rgba(0, 234, 255, 0.6);
    transform: translateY(-2px); 
}