/*
 Theme Name:   Astra Child
 Theme URI:    https://wpastra.com/
 Description:  Tema hijo de Astra
 Author:       Fran Casas
 Author URI:   https://casaselectronics.com/
 Template:     astra
 Version:      1.0.0
*/

/* Submenú en páginas de producto */
.single-product .main-header-menu .sub-menu {
    background-color: #0F172961; /* Cambia el color de fondo */
    color: #0F172961; /* Cambia el color del texto */
}

.single-product .main-header-menu .sub-menu a {
    color: #FFFFFFFF; /* Cambia el color de los enlaces */
}

/* Si el submenú sigue teniendo un borde blanco, lo puedes eliminar */
.single-product .main-header-menu .sub-menu li {
    border: none;
}

.texto-justificado .spectra-info-box-description {
    text-align: justify;
}

/*Justificar bloques infobox*/
.texto-justificado .uagb-ifb-desc {
  text-align: justify !important;
}

/*Justificar bloques parrafo*/
.texto-justificado-parrafo {
  text-align: justify;
  line-height: 1.7;
  font-size: 16px;
  text-justify: inter-word;
}

/* Ajustar color de blog*/
body.blog {
  background-color: #ffffff !important; /* o el color que uses */
}

/* Ajustar size de banner cookieYes en moviles */
/* Limita el ancho del banner y evita scroll horizontal */
#cky-banner {
  max-width: 100vw;
  overflow-x: hidden;
}
/* También puede ayudar en algunos temas */
html, body {
  overflow-x: hidden !important;
}
/* Corrige posible conflicto con scroll en el body */
body.cky-overlay {
  position: static !important;
}

/*Ajustar espacio lateral de la tienda*/
/* Márgenes laterales SOLO al catálogo de productos, sin afectar al bloque superior */
body.woocommerce.archive ul.products.columns-4 {
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}
/*Ajustar un hueco arriba de 20px en los productos seleccionados del catálogo*/
@media only screen and (max-width: 768px) {
  .single-product .woocommerce-product-gallery {
    margin-top: 20px;
  }
}

/*Añadir una separación superior al logo en version PC y tablet*/
@media (min-width: 769px) {
  .ast-site-identity img {
    position: relative;
    top: 30px; /* Ajusta este valor a tu gusto */
  }
}

/********* CABECERA CATEGORÍAS WOOCOMMERCE *********/

/* Parámetros personalizables */
:root {
    --cabecera-altura: 220px;        /* ALTURA de la cabecera (escritorio) */
    --cabecera-altura-movil: 160px;  /* ALTURA en móviles */
    --filtro-azul: 0.5;             /* Intensidad del filtro azul (0 a 1) */
}

.category-header {
    position: relative;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    height: var(--cabecera-altura);
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Título */
.category-header h1 {
    color: #fff;
    font-size: 2.5rem;
    z-index: 2;
    text-align: center;
    padding: 0 20px;
}

/* Overlay azul */
.category-header::after {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0, 0, 255, var(--filtro-azul));
    z-index: 1;
}

/* Responsivo móvil */
@media (max-width: 768px) {
    .category-header {
        height: var(--cabecera-altura-movil);
    }
    .category-header h1 {
        font-size: 1.5rem;
    }
}

/********** SIZE MINIATURA CATEGORIAS WOOCOMMERCE ***********/
:root {
    /* Alturas */
    --categoria-altura: 300px;        /* altura escritorio */
    --categoria-altura-movil: 180px;  /* altura móvil */

    /* Overlay azul */
    --overlay-azul: 0;            /* intensidad azul (0 a 1) */

    /* Tarjeta nombre + número productos */
    --tarjeta-color-texto: #ffffff;     /* color del texto */
    --tarjeta-fondo: rgba(0,0,0,0.4);   /* color y opacidad del fondo de la tarjeta */
    --tarjeta-border-radius: 4px;       /* redondeo de esquinas de la tarjeta */
}

/* Contenedor categoría */
.woocommerce ul.products li.product-category {
    position: relative;
    width: 100%; /* ocupa todo el ancho del contenedor padre */
    height: var(--categoria-altura);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* Oculta miniatura <img> original */
.woocommerce ul.products li.product-category img {
    display: none;
}

/* Div con background-image */
.category-bg {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
}

/* Overlay azul opcional */
.woocommerce ul.products li.product-category::after {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,255,var(--overlay-azul));
    z-index: 1;
}

/* Tarjeta con nombre + número productos centrada */
.woocommerce ul.products li.product-category .woocommerce-loop-category__title {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: var(--tarjeta-color-texto);
    background: var(--tarjeta-fondo);
    padding: 5px 10px;
    border-radius: var(--tarjeta-border-radius);
    z-index: 2;
}

/* Número de productos */
.woocommerce ul.products li.product-category .woocommerce-loop-category__title .count {
    color: var(--tarjeta-color-texto) !important;
    font-weight: normal;
}

/* Hover seguro: tarjeta y texto no cambian al pasar el ratón */
.woocommerce ul.products li.product-category a,
.woocommerce ul.products li.product-category a:hover,
.woocommerce ul.products li.product-category .woocommerce-loop-category__title,
.woocommerce ul.products li.product-category .woocommerce-loop-category__title:hover {
    background: var(--tarjeta-fondo) !important;
    color: var(--tarjeta-color-texto) !important;
}

/* Responsive móvil */
@media (max-width: 768px) {
    .woocommerce ul.products li.product-category {
        height: var(--categoria-altura-movil);
    }
}