/* 1. LA BARRA SUPERIOR (NAV / CONTACTO) - AZUL */
.header-nav {
    background-color: #1D3A6D !important;
}

/* Forzar textos de la barra azul a blanco */
.header-nav, .header-nav a, .header-nav i, .header-nav span {
    color: #FFFFFF !important;
}

/* 2. LA BARRA DEL MEDIO (LOGO Y BUSCADOR) - ORO */
.header-top {
    background-color: #1b3d70 !important;
}

/* 3. LA BARRA INFERIOR (SI TU MENÚ ESTÁ AQUÍ) - ORO */
.header-bottom {
    background-color: #B58200 !important;
}

/* Forzar textos de las barras oro a blanco */
.header-top a, .header-top span, .header-top i,
.header-bottom a, .header-bottom span, .header-bottom i {
    color: #FFFFFF !important;
}

/* RESET DE SEGURIDAD: Que el contenedor padre no tenga fondo */
#header, .header-container {
    background-color: transparent !important;
}

/* --- 1. SECCIÓN DE NEWSLETTER (AZUL) --- */
.email-subscription {
    background-color: #B58200  !important;
    color: #FFFFFF !important;
}

/* Forzar que el texto descriptivo sea blanco */
.email-subscription p,
.email-subscription .h1,
.email-subscription span {
    color: #FFFFFF !important;
}

/* --- 2. EL RESTO DEL FOOTER MAIN (DORADO) --- */
.footer-main, .footer__main {
    background-color: #1D3A6D !important;
    color: #FFFFFF !important;
}

/* Enlaces y títulos en el footer dorado */
.footer-main a,
.footer-main .h3,
.footer-main h3 {
    color: #FFFFFF !important;
}

/* Quitar el fondo al badge del carrito o elementos similares */
.header-block__badge {
    background-color: transparent !important; /* Elimina el color de fondo */
    background: none !important;              /* Por si tiene un degradado */
    color: #FFFFFF !important;                /* Asegura que el número sea blanco para que se vea sobre el azul/oro */
    box-shadow: none !important;              /* Quita cualquier sombreado */
    border: none !important;                  /* Quita bordes si los tuviera */
}

/* --- CORRECCIÓN DE COLOR EN MENÚ DESPLEGABLE --- */

/* Cambiar el texto de los enlaces del submenú al azul FES */
.main-menu__tree__link.dropdown-item {
    color: #1D3A6D !important;
    background-color: transparent !important;
}

/* Efecto al pasar el mouse (hover) en el menú desplegable */
.main-menu__tree__link.dropdown-item:hover {
    color: #B58200 !important; /* Cambia a Oro al pasar el mouse */
    background-color: #f8f9fa !important; /* Un gris muy tenue de fondo */
}

/* Si el menú tiene flechas o iconos, también los pintamos de azul */
.main-menu__tree__link.dropdown-item i {
    color: #1D3A6D !important;
}

/* Cambiar a blanco el texto del enlace de contacto en el header superior */
#contact-link,
#contact-link a,
#contact-link span {
    color: #FFFFFF !important;
    text-decoration: none; /* Por si es un enlace, para que no se subraye */
}

/* Si quieres que al pasar el mouse cambie ligeramente al oro Acatlán */
#contact-link a:hover {
    color: #B58200 !important;
}

/* --- RESET Y AJUSTE DEL BANNER ACATLÁN --- */

/* Aseguramos que el contenedor no tenga paddings extraños del tema */
#index .carousel-inner {
    max-height: 450px !important; /* Altura máxima permitida */
    height: auto !important;
    background-color: #FFFFFF;
}

/* Forzamos a la imagen a ser horizontal y cubrir el espacio */
#index .carousel-item img,
#index .carousel__item img {
    display: block !important;
    width: 100% !important;
    height: 450px !important; /* Forzamos esta altura para que todos los banners midan igual */
    object-fit: contain !important; /* Prueba 'contain' para ver la imagen completa sin recortes */
    background-color: #FFFFFF; /* Si la imagen es más corta, el fondo será blanco */
}

/* Centramos los controles (flechas) por si se movieron */
.carousel-control-prev, .carousel-control-next {
    height: 50px;
    top: 50%;
    transform: translateY(-50%);
}