/*
Theme Name:     Foxiz child
Template:      	foxiz
Theme URI:      https://foxiz.themeruby.com
Author:         Theme-Ruby
Author URI:     https://themeforest.net/user/theme-ruby/portfolio/
Description:    Make your modifications to Foxiz in this child theme.
Version:        1.0
Tags:           custom-background, custom-menu, featured-images, theme-options, custom-colors, translation-ready, threaded-comments, translation-ready
License:        Themeforest Licence
License URI:    https://themeforest.net/licenses/standard
*/

/* Your CSS code goes here
-------------------------------------- */

footer .menu .menu-item a {  font-size: 16px !important; color: #ffffff !important; }
footer .menu .menu-item a:hover { color: #ad333e !important; }

.elementor-widget-foxiz-list-box-2 .p-list-box-2.box-border { background-color: #f4f4f4 !important; }
[data-theme='dark'] .elementor-widget-foxiz-list-box-2 .p-list-box-2.box-border { background-color: transparent !important; }
.icon-footer .elementor-icon-box-icon { margin-top: -10px; }
.anuncio-centrado { text-align: center; }
.mobile-menu > li.menu-item-has-children:not(:first-child) { margin-top: 10px; }
.sticky-header { position: fixed; top: 0; left: 0; width: 100%; z-index: 9999; transition: all 0.3s ease-in-out; }

.category-sociales .elementor-widget-foxiz-single-featured { display: none; }
.pum-title.popmake-title { display: none !important; }

/* ACORDION MENU */
.acordion-menu > .sub-menu { display: none; overflow: hidden; padding-left: 0px; border-top: 1px solid #eee; }
.acordion-menu.menu-item-has-children > a { cursor: pointer; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ddd; text-decoration: none; color: inherit; font-weight: bold; }
.acordion-menu.menu-item-has-children > a::after { content: '▼'; font-size: 0.8em; margin-left: 10px; transition: transform 0.3s ease; display: inline-block; }
.acordion-menu.menu-item-has-children.active > a::after { content: '▲'; }
.acordion-menu .sub-menu li a { padding: 8px 0; display: block; text-decoration: none; color: #555; }

/* SLIDER NOTAS (SLICK) */
.slick-slider { position: relative; }
.slick-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; background-color: rgba(0, 0, 0, 0.7); color: white;  border: none; padding: 10px 15px; cursor: pointer; outline: none; font-size: 24px; line-height: 1; border-radius: 3px; transition: background-color 0.3s ease; }
.slick-prev { left: 10px; }
.slick-next { right: 10px; }
.slick-arrow:hover { background-color: rgba(0, 0, 0, 0.9); }
.gallery.is-slick-slider:not(.slick-initialized),
.wp-block-gallery.is-slick-slider:not(.slick-initialized) { opacity: 0; visibility: hidden; height: 0; overflow: hidden; }

.slick-slider .wp-block-image figcaption,
.slick-slider .gallery-item figcaption { margin: 0; padding: 5px; box-sizing: border-box; font-size: 0.9em; line-height: 1.2; color: #666; text-align: center; background-color: rgba(0,0,0,0.5) !important; }

.slick-slider figure.wp-block-image,
.slick-slider figure.gallery-item { margin: 0; padding: 0; }
/* Default WordPress 3px que le pone a los fig caption */
.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption):before { -webkit-backdrop-filter: blur(0px) !important; backdrop-filter: blur(0px) !important; }

.slick-slider figure.gallery-item,
.slick-slider figure.wp-block-image {
    position: relative; /* Importante para el posicionamiento de la imagen dentro */
    width: 100%;
    /* Define la altura fija. Puedes usar 'px' para una altura específica,
       o 'vh' para una altura relativa a la altura del viewport. */
    height: 500px; /* Ejemplo: 500 píxeles de alto en todas las pantallas grandes */
    overflow: hidden; /* Oculta cualquier parte de la imagen o caption que se desborde */
    display: flex; /* Usamos flexbox para centrar o alinear contenido si es necesario */
    flex-direction: column; /* Apila la imagen y el caption verticalmente */
    justify-content: center; /* Centra el contenido verticalmente */
    align-items: center; /* Centra el contenido horizontalmente */
}

/* 2. Asegura que la imagen dentro del slide llene su contenedor y sea responsiva */
.slick-slider figure.gallery-item img,
.slick-slider figure.wp-block-image img {
    display: block; /* Elimina cualquier espacio extra debajo de la imagen */
    width: 100%; /* La imagen siempre ocupará el 100% del ancho del slide */
    height: 100%; /* La imagen siempre ocupará el 100% de la altura del slide */
    object-fit: cover; /* <--- CLAVE: Esto hará que la imagen llene el espacio, recortando los bordes si es necesario para mantener su proporción */
    object-position: center; /* Opcional: Centra la imagen dentro del área visible */
}

/* 3. Ajustes para el figcaption para que no altere la altura de la imagen */
/* Si el figcaption se muestra encima o debajo de la imagen, esto podría ser más complejo.
   Aquí asumimos que está dentro del mismo flujo del 'figure' o que lo harás posicionado absolutamente. */
.slick-slider figure.gallery-item figcaption,
.slick-slider figure.wp-block-image figcaption {
    /* Si el caption debe estar dentro de la altura fija, se ajustaría con el flexbox de arriba.
       Si quieres que esté POR ENCIMA de la imagen o FLOTE, deberías posicionarlo absolutamente.
       Aquí un ejemplo si quieres que flote en la parte inferior sobre la imagen: */
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Fondo semitransparente para que se lea */
    color: white;
    padding: 10px;
    text-align: center;
    box-sizing: border-box; /* Asegura que el padding no añada ancho/alto */
    margin: 0; /* Elimina márgenes extra */
    font-size: 0.9em; /* Ajusta tamaño de fuente */
    line-height: 1.2; /* Ajusta espaciado de línea */
}

.banner-fijo { position: fixed; bottom: 5px; left: 50%; transform: translateX(-50%); z-index: 9999; width: 100%; max-width: 728px; text-align: center; padding: 0px 10px; }
.banner-cierre { position: absolute; top: 0px; right: 0px; width: 20px; height: 20px; background-color: #000; color: #fff; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 10px; cursor: pointer; line-height: 1; text-decoration: none; }

#ggbl_lightbox { background: rgba(0, 0, 0, 0.8); }
.ggbl_prev { border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-right: 15px solid rgba(255, 255, 255, 0.7); margin-left: 10px; }
.ggbl_prev:hover { border-right: 15px solid rgba(255, 255, 255, 1); }
.ggbl_next { border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-left: 15px solid rgba(255, 255, 255, 0.7);  margin-right: 10px; }
.ggbl_next:hover { border-left: 15px solid rgba(255, 255, 255, 1); }
.single-post .font-resizer-trigger { display: none; }

@media (max-width: 992px) { /* Para tablets y pantallas más pequeñas */
    .slick-slider figure.gallery-item,
    .slick-slider figure.wp-block-image {
        height: 480px; /* Reduce la altura en pantallas medianas */
    }
}

@media (max-width: 768px) { /* Para móviles grandes */
    .slick-slider figure.gallery-item,
    .slick-slider figure.wp-block-image {
        height: 480px; /* Reduce aún más la altura */
    }
}

@media (max-width: 576px) { /* Para móviles pequeños */
    .slick-slider figure.gallery-item,
    .slick-slider figure.wp-block-image {
        height: 300px; /* Altura más pequeña para pantallas muy estrechas */
    }
}