/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 07 2026 | 23:47:18 */
/* 1. OCULTAR TALLAS (FILA COMPLETA) */
.cfvsw-shop-variations tr:has([swatches-attr*="talla"]), 
.cfvsw-shop-variations tr:has([swatches-attr*="size"]) {
    display: none !important;
}
/* 2. LIMPIEZA DE FILAS VACÍAS (ELIMINA SALTOS VISUALES) */
.cfvsw-shop-variations tr:not(:has(td)) {
    display: none !important;
}
/* 3. ALINEACIÓN DE BLOQUE (EL MANDO DE CONTROL) */
.woocommerce ul.products li.product .cfvsw_variations_form {
    margin-top: 15px !important; 
    margin-bottom: 10px !important;
    display: block !important;
}
/* 4. ESTILO DE LOS SWATCHES (CÍRCULOS) */
.woocommerce ul.products li.product .cfvsw-swatches-container {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    min-height: 30px !important;
    max-height: 30px !important; 
    overflow: hidden !important; 
    width: 100% !important;
    gap: 8px !important; 
    padding: 0 !important;
    margin-top: 0 !important;
}
/* 5. OCULTAR CONTENEDOR SI ESTÁ VACÍO (SOMBRERO) */
.cfvsw_variations_form:not(:has(td)) {
    display: none !important;
}
/* Ajuste de separación WEB */
@media (min-width: 769px) {
    .woocommerce ul.products li.product .cfvsw-swatches-container {
        margin-top: -10px !important;
        margin-bottom: 15px !important;
    }
}
/* Ajuste de separación MÓVIL */
@media (max-width: 768px) {
    .woocommerce ul.products li.product .cfvsw-swatches-container {
        margin-top: -10px !important;
        margin-bottom: 10px !important;
    }
}
/* 3. CÍRCULOS: ESTILO Y TAMAÑO ÚNICO (28px) */
.woocommerce ul.products li.product .cfvsw-swatches-option {
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    border-radius: 50% !important;
    border: none !important;
    margin: 0 !important; /* Eliminado el margen como pediste */
    display: inline-block !important;
}
/* 4. LIMPIEZA DE ELEMENTOS EXTRA */
.woocommerce ul.products li.product .cfvsw-swatches-option:after,
.woocommerce ul.products li.product .cfvsw-swatches-option:before {
    display: none !important;
}
/* OCULTAR SWATCHES SIN STOCK EN EL GRID DE TIENDA */
.woocommerce ul.products li.product .cfvsw-swatches-option.cfvsw-swatches-disabled,
.woocommerce ul.products li.product .cfvsw-swatches-option.cfvsw-swatches-blur-cross-disable {
    display: none !important;
}
/* 1. VISTA WEB (PC / TABLET GRANDE) */
@media (min-width: 769px) {
    #ast-scroll-top {
        bottom: 20px !important;
        right: 20px !important;
        z-index: 998 !important;
    }
    #moderncart-floating-cart {
        /* En PC lo subimos a 80px para que no tape nada del diseño de Astra */
        bottom: 60px !important; 
        right: 20px !important;
        z-index: 999 !important;
    }
}
/* 2. VISTA MÓVIL (TU CÓDIGO DE AYER QUE FUNCIONABA) */
@media (max-width: 768px) {
    #ast-scroll-top {
        bottom: 20px !important;
        right: 20px !important;
        z-index: 998 !important;
    }
    #moderncart-floating-cart {
        /* El valor de 62px que te iba perfecto ayer en Safari/Android */
        bottom: 62px !important; 
        right: 20px !important;
        z-index: 999 !important;
    }
}
/* --- GUÍA DE TALLAS ARGUINEGUÍN PRO --- */
.caja-guia-medidas {
    margin-bottom: -5px !important; 
    line-height: 1 !important;
}
.caja-guia-medidas .wpb-psc-btn {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    font-size: 10px !important; /* Un pelín más pequeño es más elegante */
    font-weight: 600 !important; /* Un poco más de cuerpo */
    text-transform: uppercase;
    color: #333 !important; /* Un negro menos agresivo */
    cursor: pointer;
    box-shadow: none !important;
    /* EL TOQUE PRO: */
    letter-spacing: 1.5px !important; /* Letras más separadas (estilo marca de ropa) */
    transition: opacity 0.3s ease !important; /* Transición suave al pasar el ratón */
    display: inline-block !important; 
}
/* Interacción elegante */
.caja-guia-medidas .wpb-psc-btn:hover {
    text-decoration: underline !important;
    opacity: 0.6; /* Se aclara suavemente al pasar el ratón */
}
/* Limpieza de iconos */
.caja-guia-medidas .wpb-psc-btn::before,
.caja-guia-medidas .wpb-psc-btn img {
    display: none !important;
    content: none !important;
}
/* Ajustes específicos para móviles */
@media (max-width: 767px) {
    .caja-guia-medidas {  
        margin-bottom: -5px !important; 
    }
    .caja-guia-medidas .wpb-psc-btn {
        letter-spacing: 1.2px !important;
    }
}
/* 1. EL CONTENEDOR (EL CÍRCULO) */
.svi-mainsection .sviLigthgallery {
    display: block !important;
    background-color: #000 !important;
    width: 45px !important;
    height: 45px !important;
    border-radius: 50% !important;
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 999 !important;
    cursor: pointer !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
    border: none !important;
    outline: none !important;
}
/* 2. EL ARO DE LA LUPA (DESPLAZADO 2PX A LA DERECHA) */
.svi-mainsection .sviLigthgallery::before {
    content: "" !important;
    position: absolute !important;
    top: 12px !important; 
    left: 13px !important; /* De 12px a 14px para moverlo a la derecha */
    width: 16px !important;
    height: 16px !important;
    border: 2.5px solid #fff !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
}
/* 3. EL MANGO DE LA LUPA (MÁS LARGO Y AJUSTADO) */
.svi-mainsection .sviLigthgallery::after {
    content: "" !important;
    position: absolute !important;
    top: 27px !important; /* Ajuste para mantener la conexión con el aro desplazado */
    left: 25px !important; /* Ajuste para mantener la conexión */
    width: 10px !important; /* De 8px a 10px para que sea más grande */
    height: 3px !important;
    background-color: #fff !important;
    transform: rotate(45deg) !important;
    border-radius: 0 2px 2px 0 !important;
}
/* 1. CONTENEDOR DE LAS MINIATURAS */
.svithumbnails {
    margin-top: 15px !important;
    display: flex !important;
     /* Espacio entre fotos */
    list-style: none !important;
    padding: 0 !important;
}
/* 2. CADA MINIATURA (EL LI Y LA IMAGEN) */
.svithumbnails li {
    flex: 1 !important; /* Para que todas midan lo mismo */
    transition: transform 0.3s ease !important;
}
.svithumbnails li img {
    width: 100% !important;
    height: auto !important;
    border-radius: 5px !important;
    transition: all 0.3s ease !important;
    opacity: 0.7; /* Un pelín apagadas de base */
    cursor: pointer !important;
    border: 1px solid #eee !important;
}
/* 3. EFECTO PRO AL PASAR EL RATÓN (HOVER) */
.svithumbnails li:hover img {
    opacity: 1 !important;
    border-color: #000 !important; /* Borde negro al señalar */
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}
.svithumbnails li:hover {
    transform: translateY(-5px) !important; /* El saltito que queríamos */
}
/* 4. EFECTO PARA LA QUE ESTÁ SELECCIONADA (SVI suele usar la clase .svi-active o similar) */
/* Si el plugin no añade clase activa, el hover ya hará el 80% del trabajo */
.svithumbnails li img.svi-thumb-image:active {
    transform: scale(0.95) !important; /* Efecto de pulsación al clicar */
}
/* CORRECCIÓN ESPECÍFICA PARA TEMPLATE FEMME WARDROBE */
/* 1. Forzamos el margen en el contenedor principal de la tienda */
.ast-woo-shop-archive .site-content {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}
/* 2. En este template, Astra usa un margin-left/right negativo a veces. Lo ponemos a cero. */
.ast-woo-shop-archive .ast-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
/* 3. El ajuste para que la M y la Flecha respiren en móvil */
@media (max-width: 768px) {
    .ast-header-break-point.ast-woo-shop-archive .site-content {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    /* Forzamos que la barra de resultados no toque el cristal */
    .ast-woocommerce-container {
        padding: 0 5px !important;
    }
}
/* --- TU CÓDIGO ORIGINAL SIN TOCAR --- */
/* 1. Contenedor: Cortamos lo que sobre y redondeamos esquinas */
.ast-woo-shop-archive .astra-shop-thumbnail-wrapper {
    overflow: hidden !important;
    border-radius: 12px !important;
    background-color: #fff;
    transition: all 0.4s ease-in-out !important;
}
/* 2. La imagen: Ajuste de suavidad total */
.ast-woo-shop-archive .product img {
    transition: transform 0.8s cubic-bezier(0.2, 1, 0.3, 1), filter 0.5s ease !important;
}
/* 3. EFECTO HOVER */
.ast-woo-shop-archive .product:hover img {
    transform: scale(1.12) !important;
    filter: brightness(1.03);
}
/* 4. Elevación del cuadro del producto */
.ast-woo-shop-archive .product {
    padding: 10px !important;
    border-radius: 15px !important;
    transition: all 0.4s ease !important;
    border: 1px solid transparent;
    /* ESTA LÍNEA ES LA CLAVE PARA EL IPHONE: */
    touch-action: manipulation; 
}
.ast-woo-shop-archive .product:hover {
    background: #ffffff !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08) !important;
    transform: translateY(-8px);
    z-index: 10;
}
/* 5. Ajuste para que el botón de "Añadir al carrito" no se vea pegado */
.ast-woo-shop-archive .ast-onsale {
    z-index: 2 !important;
}
/* SUSTITUIR BOLSO POR EL "+" COOL */
.ast-icon.icon-bag svg {
    display: none !important;
}
.ast-icon.icon-bag {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 32px !important;
    height: 32px !important;
    background-color: #000;
    border-radius: 50%;
    position: relative;
    transition: all 0.3s ease;
}
.ast-icon.icon-bag::after {
    content: "+";
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 20px;
    font-weight: 300;
    line-height: 1;
}
.product:hover .ast-icon.icon-bag {
    transform: rotate(90deg);
    background-color: #333;
}
/* SOLUCIÓN DE PRECISIÓN: ICONO NEGRO SOLO SI EL MENÚ ESTÁ CERRADO */
@media (max-width: 921px) {
    /* 1. Solo cuando la cabecera NO es transparente Y el menú NO está abierto */
    .ast-header-break-point:not(.ast-theme-transparent-header) .main-header-menu-toggle:not(.toggled) .ast-mobile-svg {
        fill: #000000 !important;
    }
    .ast-header-break-point:not(.ast-theme-transparent-header) .main-header-menu-toggle:not(.toggled) .ast-mobile-menu-trigger-fill {
        color: #000000 !important;
        border-color: #000000 !important;
    }
    /* 2. Aseguramos que cuando se ABRE (clase .toggled), vuelva a ser blanco o su color original */
    .ast-header-break-point .main-header-menu-toggle.toggled .ast-mobile-svg {
        fill: #ffffff !important;
    }
    .ast-header-break-point .main-header-menu-toggle.toggled {
        color: #ffffff !important;
    }
}
/* NAVEGACIÓN MÓVIL: COLOR BLANCO PARA HOVER Y PÁGINA ACTUAL */
@media (max-width: 921px) {
    /* 1. Página actual y cuando pasas el dedo (Hover) */
    .ast-header-break-point .main-header-menu .current-menu-item > a,
    .ast-header-break-point .main-header-menu .menu-item:hover > a,
    .ast-header-break-point .main-header-menu .menu-item.focus > a {
        color: #ffffff !important; /* Siempre blanco */
        background-color: rgba(255, 255, 255, 0.1) !important; /* Un fondo sutil para notar el toque */
    }
    /* 2. Asegurar que los textos de los links no se vuelvan negros en ningún estado del móvil */
    .ast-header-break-point .main-header-menu a {
        color: #ffffff !important;
    }
    /* 3. El indicador de la página actual un pelín más suave para diferenciar */
    .ast-header-break-point .main-header-menu .current-menu-item > a {
        opacity: 0.8 !important;
    }
}
/* --- 1. BARRA SUPERIOR (Above Header) --- */
/* En PC: Fondo sólido */
@media (min-width: 922px) {
    .ast-above-header-wrap {
        background-color: #1a1a1a !important;
        border: none !important;
    }
}
/* En MÓVIL: Cristal optimizado y EXTRA fino */
@media (max-width: 921px) {
    .ast-above-header-wrap {
        /* Subimos un poco la opacidad (0.7) para que en el blanco de la tienda se siga viendo el cristal */
        background-color: rgba(20, 20, 20, 0.7) !important; 
        backdrop-filter: blur(12px) !important;
        -webkit-backdrop-filter: blur(12px) !important;
        padding: 0 !important; /* Eliminamos el grosor */
        border: none !important;
    }
    /* Forzamos a que las filas internas de Astra no añadan altura ni bordes */
    .ast-above-header-bar, 
    .ast-above-header-section-center, 
    .ast-builder-grid-row {
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
        min-height: auto !important; /* Esto quita lo "gordo" de la barra */
    }
    /* Quitamos la rayita de debajo */
    [data-section="section-above-header-builder"] {
        border-bottom: none !important;
        box-shadow: none !important;
    }
}
/* --- 2. ARREGLO BANDERA SELECCIONADA Y LIMPIEZA --- */
.wpml-ls-statics-shortcode_actions .wpml-ls-current-language a,
.wpml-ls-item, .wpml-ls-item a {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}
/* --- 3. EFECTO PRO Y SEPARACIÓN --- */
.wpml-ls-legacy-list-horizontal ul {
    display: flex !important;
    justify-content: center;
    gap: 15px !important; 
    margin: 0 !important; /* Quitamos márgenes */
    padding: 8px 0 !important; /* ESTO controla el grosor final. Si la quieres más fina, baja a 5px */
}
/* Gap de 20px solo en PC como a ti te gusta */
@media (min-width: 922px) {
    .wpml-ls-legacy-list-horizontal ul {
        gap: 20px !important;
        padding: 10px 0 !important;
    }
}
.wpml-ls-flag {
    transition: transform 0.2s ease;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.3);
    border-radius: 1px;
}
.wpml-ls-item a:hover .wpml-ls-flag {
    transform: scale(1.15);
}
/* EL BLOG DE ARGUINEGUÍN: NIVEL "HISTORIAS" (CÁLIDO Y HUMANO) */
/* 1. La tarjeta: Estilo Papel de Alto Gramaje */
#pt-cv-view-5a36602 .pt-cv-content-item {
    background: #fffdf9 !important; /* El blanco crema que nos enamoró */
    padding: 40px !important;
    border-radius: 2px !important; /* Volvemos a la esquina casi recta de papel */
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    /* Borde lateral Navy: Como el lomo de un cuaderno náutico */
    border: none !important;
    border-left: 6px solid #02142e !important; 
    box-shadow: 5px 5px 20px rgba(0,0,0,0.05) !important;
    margin-bottom: 50px !important;
    position: relative;
}
/* 2. Efecto al pasar el ratón: La "Postal" se mueve */
#pt-cv-view-5a36602 .pt-cv-content-item:hover {
    transform: rotate(-1deg) scale(1.02) !important; /* La inclinación mágica */
    box-shadow: 15px 20px 40px rgba(2, 20, 46, 0.12) !important;
    background: #ffffff !important;
}
/* 3. La Imagen: Polaroid Marinera con Efecto Pro */
/* El contenedor del marco blanco */
#pt-cv-view-5a36602 .pt-cv-href-thumbnail {
    background: #ffffff !important;
    padding: 12px 12px 45px 12px !important; /* El pie de la Polaroid */
    box-shadow: 4px 6px 15px rgba(0,0,0,0.08) !important;
    transform: rotate(1.5deg); /* Inclinación inicial */
    margin-bottom: 30px !important;
    border: 1px solid #f0f0f0 !important;
    display: block !important;
    line-height: 0 !important;
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    position: relative;
    overflow: hidden; /* Para que el zoom de la foto no se salga del marco */
}
/* La foto dentro de la Polaroid */
#pt-cv-view-5a36602 .pt-cv-thumbnail {
    border-radius: 0 !important;
    filter: sepia(0.08) brightness(1.02) contrast(1.05) !important;
    transition: all 0.8s ease !important;
    width: 100% !important;
    height: auto !important;
}
/* EFECTO EN IMAGEN: Al pasar el ratón por la tarjeta */
#pt-cv-view-5a36602 .pt-cv-content-item:hover .pt-cv-href-thumbnail {
    transform: rotate(-0.5deg) scale(1.04) !important; /* Se endereza un poco y crece */
    box-shadow: 10px 20px 35px rgba(2, 20, 46, 0.15) !important;
    z-index: 10;
}
#pt-cv-view-5a36602 .pt-cv-content-item:hover .pt-cv-thumbnail {
    transform: scale(1.1) !important; /* Zoom suave a la foto */
    filter: sepia(0) brightness(1.1) contrast(1.1) !important; /* Limpia el filtro sepia al mirar */
}
/* 4. Título: Elegancia de Antaño */
#pt-cv-view-5a36602 .pt-cv-title a {
    color: #02142e !important;
    font-family: 'Playfair Display', serif !important;
    font-style: italic; /* Como el de Gracias */
    font-weight: 700 !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
}
/* 5. El Contenido: Espaciado y Humano */
#pt-cv-view-5a36602 .pt-cv-content {
    font-size: 19px !important;
    line-height: 1.8 !important;
    color: #555 !important;
    margin-top: 15px !important;
}
/* 6. Botón: La firma del Capitán */
#pt-cv-view-5a36602 .pt-cv-readmore {
    background-color: transparent !important;
    color: #02142e !important;
    border: none !important;
    border-bottom: 2px solid #d4a373 !important; /* Línea color arena */
    padding: 5px 0 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    text-transform: lowercase !important;
    transition: all 0.3s !important;
}
#pt-cv-view-5a36602 .pt-cv-readmore:hover {
    padding-left: 15px !important;
    color: #d4a373 !important;
}
/* 7. El sello de "Arguineguín, GC" (Ajustado al nuevo contenedor) */
#pt-cv-view-5a36602 .pt-cv-href-thumbnail::after {
    content: "ARGUINEGUÍN, GC";
    position: absolute;
    bottom: 15px;
    left: 0;
    right: 0;
    text-align: center;
    font-family: 'Courier New', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
    color: #2c2c2c; /* Color arena para que sea más cálido */
    opacity: 0.7;
}
/* EFECTO STORYTELLING: CÁLIDO Y HUMANO (GRACIAS) */
/* 1. La tarjeta estilo "Postal" */
#pt-cv-view-249070a .pt-cv-content-item {
    background: #fffdf9 !important; /* Un blanco crema, como papel antiguo */
    padding: 35px !important;
    border-radius: 2px !important; /* Esquinas casi rectas, como una carta */
    transition: all 0.5s ease !important;
    border-left: 5px solid #d4a373 !important; /* Una línea color arena/tierra */
    box-shadow: 5px 5px 15px rgba(0,0,0,0.05) !important;
    margin-bottom: 40px !important;
    position: relative;
}
/* Efecto al pasar el ratón: Sombra cálida */
#pt-cv-view-249070a .pt-cv-content-item:hover {
    transform: rotate(-1deg) scale(1.02) !important; /* Se inclina un poco, como una foto sobre la mesa */
    box-shadow: 10px 10px 25px rgba(212, 163, 115, 0.2) !important;
}
/* 2. Título de la historia (Más personal) */
#pt-cv-view-249070a .pt-cv-title a {
    color: #5d4037 !important; /* Marrón chocolate suave */
    font-family: 'Playfair Display', serif !important; /* Si tu tema la tiene, si no, se verá elegante igual */
    font-size: 28px !important;
    font-style: italic;
    font-weight: 600 !important;
    text-decoration: none !important;
}
/* 3. El contenido del sentimiento */
#pt-cv-view-249070a .pt-cv-content {
    font-size: 19px !important;
    line-height: 1.8 !important;
    color: #555 !important;
    font-style: normal !important;
    margin-top: 15px !important;
}
/* 4. Botón "Leer la historia completa" */
#pt-cv-view-249070a .pt-cv-readmore {
    background-color: transparent !important;
    color: #d4a373 !important;
    border: none !important;
    border-bottom: 2px solid #d4a373 !important; /* Solo una línea abajo */
    padding: 5px 0 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    text-transform: lowercase !important;
}
#pt-cv-view-249070a .pt-cv-readmore:hover {
    color: #5d4037 !important;
    border-color: #5d4037 !important;
    padding-left: 10px !important;
}
/* 5. Fecha y Autor (Ocultamos "admin" para que sea más íntimo si quieres) */
#pt-cv-view-249070a .entry-date {
    font-size: 14px !important;
    color: #999 !important;
    text-transform: uppercase;
    letter-spacing: 1px;
}
/* Ocultar el encabezado por defecto del plugin */
#pt-cv-view-249070a .pt-cv-heading {
    display: none !important;
}
/* 6. EFECTO POLAROID REAL (PRECISIÓN PARA CONTENT VIEWS) */
/* El enlace que envuelve la imagen se convierte en el papel de la Polaroid */
#pt-cv-view-249070a .pt-cv-href-thumbnail {
    display: inline-block !important;
    background: #ffffff !important;
    padding: 12px 12px 45px 12px !important; /* El pie ancho de la Polaroid */
    border: 1px solid #f0f0f0 !important;
    box-shadow: 4px 4px 12px rgba(0,0,0,0.12) !important;
    transform: rotate(-2deg); /* Inclinación "descuidada" pija */
    transition: all 0.4s ease-in-out !important;
    text-decoration: none !important;
    margin-bottom: 20px !important;
    line-height: 0 !important; /* Quita espacios fantasma debajo de la imagen */
}
/* La imagen dentro de la Polaroid */
#pt-cv-view-249070a .pt-cv-thumbnail {
    border-radius: 0 !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    filter: sepia(0.05) contrast(1.05) brightness(1.02) !important;
}
/* El efecto cuando pasas el ratón por TODA la tarjeta del post */
#pt-cv-view-249070a .pt-cv-content-item:hover .pt-cv-href-thumbnail {
    transform: rotate(0deg) scale(1.06) !important;
    box-shadow: 10px 15px 25px rgba(212, 163, 115, 0.3) !important;
    z-index: 20;
}
/* Opcional: El toque final de "texto escrito a mano" en el margen inferior */
#pt-cv-view-249070a .pt-cv-href-thumbnail::after {
    content: "Arguineguín, GC"; 
    position: absolute;
    bottom: 12px;
    left: 0;
    right: 0;
    text-align: center;
    font-family: 'Cursive', brush script mt, sans-serif;
    font-size: 15px;
    color: #a0a0a0;
    opacity: 0.7;
    line-height: 1;
}
/* 1. FONDO Y PAPEL BLANCO */
body.single-post {
    background-color: #f9f7f2 !important;
}
.single-post .entry-content {
    max-width: 850px !important;
    margin: 40px auto !important;
    padding: 60px 70px !important;
    background: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 25px 60px rgba(93, 64, 55, 0.1) !important;
}
/* 2. TÍTULO GIGANTE */
.single-post .entry-title {
    font-size: 60px !important;
    color: #02142e !important;
    text-align: center;
    font-weight: 800 !important;
    margin: 60px auto 40px !important;
}
/* 3. LA POLAROID (IMAGEN INCRUSTADA) */
/* Atacamos al contenedor Figure que es el que daba problemas */
.single-post .entry-content figure.wp-block-image {
    margin: 45px auto !important;
    text-align: center;
}
.single-post .entry-content figure.wp-block-image img {
    border: 15px solid #ffffff !important; /* El marco blanco */
    box-shadow: 0 15px 35px rgba(0,0,0,0.15) !important;
    border-radius: 2px !important;
    display: inline-block !important;
    width: auto !important;
    max-width: 100% !important;
    padding: 0 !important; /* Evita que se levante */
    background: #fff !important;
}
/* 5. TEXTO XL */
.single-post .entry-content p {
    font-size: 22px !important;
    line-height: 1.8 !important;
    color: #333 !important;
}
/* 6. BOTÓN PRO */
.wp-block-button__link {
    background-color: #02142e !important;
    color: #fff !important;
    padding: 15px 35px !important;
    border-radius: 50px !important;
    text-decoration: none !important;
}
/* OCULTAR METADATOS: AUTOR Y FECHA */
.single-post .entry-meta {
    display: none !important;
}
/* LIMPIEZA TOTAL DE "BAÑERAS" BLANCAS */
/* 1. Forzamos transparencia en todos los posibles culpables de Astra */
.single-post .site-content,
.single-post .ast-separate-container,
.single-post .ast-separate-container #primary,
.single-post .ast-separate-container .ast-article-single,
.single-post .post-thumbnail,
.single-post .wp-block-post-featured-image {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
/* 2. EFECTO GALERÍA PREMIUM (REFINADO) */
.single-post .wp-block-post-featured-image img {
    display: block !important;
    margin: 0 auto !important;
    max-width: 1000px !important;
    border-radius: 2px !important; /* Esquinas rectas de foto antigua */
    /* El Marco de la Foto */
    border: 1px solid #d4a373 !important; /* Color tierra/arena */
    padding: 12px !important; 
    background: #ffffff !important; /* Este es el UNICO blanco: el del marco de la foto */
    /* Sombra de diseño pijo */
    box-shadow: 
        10px 10px 0px rgba(212, 163, 115, 0.15), 
        0 20px 40px rgba(0,0,0,0.1) !important;
    
    transition: all 0.5s ease !important;
}
/* 3. El brillo de la foto (opcional, muy sutil) */
.single-post .wp-block-post-featured-image {
    position: relative !important;
    overflow: visible !important;
}
/* 4. Efecto Hover estilo "Postal sobre la mesa" */
.single-post .wp-block-post-featured-image:hover img {
    transform: rotate(-1deg) scale(1.03) !important;
    box-shadow: 
        15px 15px 0px rgba(212, 163, 115, 0.25), 
        0 35px 60px rgba(0,0,0,0.15) !important;
}
/* EFECTO MINIMALISTA PRO: MAR Y ARENA */
.foto-alma {
    padding: 0; 
    transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.foto-alma img {
    border-radius: 40px; /* Piedra de mar pulida */
    border: 1px solid rgba(255, 255, 255, 0.2); 
    filter: brightness(1) contrast(1.02) !important;
    transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
    /* SOMBRA NAVY OSCURO (Estado inicial) */
    box-shadow: 0 8px 20px rgba(10, 31, 68, 0.4); 
}
.foto-alma:hover img {
    transform: scale(1.03) translateY(-10px); 
    border: 1px solid rgba(244, 226, 198, 0.6); /* Borde color arena clara */
    /* SOMBRA ARENA DORADA (Al pasar el ratón) */
    /* Crea un halo cálido que parece arena bajo el sol */
    box-shadow: 0 25px 50px rgba(194, 178, 128, 0.5); 
}
/* El destello de seda */
.foto-alma::after {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    border-radius: 40px;
    background: linear-gradient(120deg, rgba(255,255,255,0) 30%, rgba(255,255,255,0.2) 50%, rgba(255,255,255,0) 70%);
    transform: translateX(-100%);
    transition: transform 0.8s ease;
    pointer-events: none;
}
.foto-alma:hover::after {
    transform: translateX(100%);
}
/* Efecto Arena consistente (Sin azul Navy) */
img.foto-alma, 
.foto-alma img {
    border-radius: 40px !important;
    box-shadow: 0 10px 30px rgba(139, 115, 85, 0.4) !important; /* Marrón Arena */
    transition: all 0.3s ease-in-out !important;
}
/* Al pasar el ratón, la sombra solo se hace más grande, pero sigue siendo Arena */
img.foto-alma:hover, 
.foto-alma img:hover {
    box-shadow: 0 15px 45px rgba(139, 115, 85, 0.6) !important; /* Más intensidad Arena */
    transform: translateY(-5px) !important;
}
/* 1. Bloqueo total del baile lateral en móviles */
html, body {
    overflow-x: hidden !important;
    position: relative;
    width: 100%;
}
/* 2. Ajuste para que el zoom de SVI no empuje la web hacia la derecha */
#page, #content, .site-content, .ast-container {
    overflow-x: hidden !important;
    width: 100%;
}
/* 3. Aseguramos que la galería sea visible y no se quede en blanco */
.gallery-svi, .svi_wrapper {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}
/* 4. Evita que el contenedor de zoom cree espacio extra a los lados */
.sviZoomContainer {
    max-width: 100vw !important;
}
/* EFECTO FINAL: Solo línea pegada al texto */
.main-navigation ul#ast-hf-menu-1 li.menu-item a.menu-link {
    position: relative !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    /* No tocamos paddings para respetar tu diseño original */
}
.main-navigation ul#ast-hf-menu-1 li.menu-item a.menu-link::after {
    content: '';
    position: absolute;
    /* 'top: 1.2em' la mantiene siempre pegada a las letras, sea cual sea el alto del menú */
    top: 1.2em; 
    left: 0;
    width: 0;
    height: 2px;
    background-color: currentColor;
    transition: width 0.3s ease;
}
/* Hover y Página Actual: La línea crece sin mover nada */
.main-navigation ul#ast-hf-menu-1 li.menu-item:hover > a.menu-link::after,
.main-navigation ul#ast-hf-menu-1 li.current-menu-item > a.menu-link::after {
    width: 100%;
}
/* EFECTO PRO BANDERAS: Sin tocar anchos ni posiciones */
/* 1. En Escritorio: Un brillo sutil al pasar el ratón */
.wpml-ls-item a img {
    transition: filter 0.3s ease !important; /* Solo animamos el filtro, no el tamaño */
}
.wpml-ls-item a:hover img {
    filter: brightness(1.2) contrast(1.1) !important; /* Solo resalta el color */
}
/* 2. En Móvil: Un efecto de "clic" táctil sin mover la barra negra */
@media (max-width: 921px) {
    .wpml-ls-item a:active img {
        filter: brightness(0.8) !important; /* Se oscurece un pelín al tocarla para dar feedback */
    }
}
/* Separación sutil de banderas solo en móvil */
@media (max-width: 921px) {
    .wpml-ls-item {
        margin-left: 4px !important;
        margin-right: 4px !important;
        display: inline-block !important; /* Asegura que el margen se aplique bien en línea */
    }
    /* Quitamos el margen a la primera y última para que no toquen los bordes de la pantalla */
    .wpml-ls-item:first-child {
        margin-left: 0 !important;
    }
    .wpml-ls-item:last-child {
        margin-right: 0 !important;
    }
}
h1, h2, h3, h4, h5, h6, .entry-title, .product_title, .elementor-heading-title {
    text-transform: none !important;
}
/* ARREGLO UNIVERSAL PARA EL CARRITO (TIENDA, CATEGORÍAS Y ETIQUETAS) */
.archive .ast-header-woo-cart .ast-addon-cart-wrap,
.tax-product_cat .ast-header-woo-cart .ast-addon-cart-wrap,
.tax-product_tag .ast-header-woo-cart .ast-addon-cart-wrap {
    padding: 2px 8px !important;
    overflow: visible !important; /* Esto evita que el círculo se corte */
}
.archive .ast-header-woo-cart i.astra-icon::after,
.tax-product_cat .ast-header-woo-cart i.astra-icon::after,
.tax-product_tag .ast-header-woo-cart i.astra-icon::after {
    right: -5px !important;
    top: -5px !important;
    z-index: 99 !important; /* Prioridad para que flote siempre arriba */
}
/* BOTÓN "PLAYA VOLCÁNICA" PRO */
.boton .wp-block-button__link {
    background-color: #ffffff !important; /* Blanco arena clara */
    color: #000000 !important;            /* Fuente negra pura */
    border: 2px solid #000000 !important; /* Borde negro fino */
    border-radius: 2px !important;       /* Esquinas casi rectas (estilo postal/diseño) */
    padding: 14px 35px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;       /* Un poco de aire entre letras */
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    box-shadow: 4px 4px 0px rgba(0,0,0,0.05) !important; /* Sombra sutil rígida */
}
/* EFECTO HOVER: ARENA VOLCÁNICA HÚMEDA */
.boton .wp-block-button__link:hover {
    background-color: #3d3028 !important; /* Marrón volcánico profundo (elegante) */
    border-color: #3d3028 !important;
    color: #ffffff !important;            /* CAMBIO: En diseño pro, sobre oscuro mejor blanco para que sea legible */
    transform: translate(-2px, -2px) !important; 
    box-shadow: 8px 8px 0px rgba(212, 163, 115, 0.2) !important; /* Sombra color arena clara */
}
/* BOTONES DE TIENDA ESTILO BLOG (BLANCO -> VOLCÁNICO) */
.single_link_to_cart_button, 
.single_add_to_cart_button, 
.woocommerce a.button.alt, 
.woocommerce button.button.alt {
    background-color: #ffffff !important; /* Fondo blanco arena */
    color: #000000 !important;            /* Texto negro puro */
    border: 2px solid #000000 !important; /* Borde negro fino y elegante */
    border-radius: 2px !important;       /* Esquinas rectas de marca premium */
    padding: 12px 25px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    display: inline-block !important;
    text-decoration: none !important;
    cursor: pointer !important;
}
/* EFECTO AL PONERSE ENCIMA (HOVER) EN LA TIENDA */
.single_link_to_cart_button:hover, 
.single_add_to_cart_button:hover, 
.woocommerce a.button.alt:hover, 
.woocommerce button.button.alt:hover {
    background-color: #3d3028 !important; /* El marrón volcánico que te gustó */
    border-color: #3d3028 !important;
    color: #ffffff !important;            /* Texto blanco para que resalte en el marrón */
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 20px rgba(61, 48, 40, 0.2) !important;
}
		.texto-chico {
   margin-top: 0px !important;
    padding-top: 0px !important;
    font-size: 13px !important; /* Tamaño tipo nota al pie */
    color: #02142e !important;
    text-align: center;
    line-height: 1.2 !important;
}
/* Forzamos el estilo sobre la regla general del tema */
.single-post .entry-content p.texto-chico {
    font-size: 12px !important;
    line-height: 1.2 !important;
    margin-top: -50px !important; /* Ajusta este valor si quieres que suba más */
    color: #02142e !important;
    text-align: center;
}
/* Si usas el bloque de productos de WooCommerce, este suele dejar mucho espacio abajo */
.woocommerce ul.products {
    margin-bottom: 5px !important;
}
/* 1. Control del espacio superior e inferior del grupo */
.single-post .entry-content .productos {
    margin-top: -20px !important;    /* Ajusta este valor para el espacio de ARRIBA */
    margin-bottom: 0px !important;  /* Pegado por abajo para el texto chico */
    padding-bottom: 0px !important;
}
/* 2. El H2 o H3 que viene DESPUÉS (lo que ya tenías) */
.single-post .entry-content .productos + h2, 
.single-post .entry-content .productos + h3 {
    margin-top: 0px !important;
    padding-top: 40px !important; 
}
/* 3. El texto que hay DENTRO del grupo (el "Más que un origen...") */
/* Si quieres que el título de dentro del grupo no tenga tanto aire arriba */
.productos h2:first-child, 
.productos h3:first-child {
    margin-top: 0px !important;
}
/* 4. Limpieza del separador */
.productos hr {
    margin-bottom: 0px !important;
}
/* --- LIBERACIÓN MÓVIL ARGUINEGUÍN PRO --- */
@media (max-width: 768px) {
    /* 1. Eliminamos el efecto "caja" estrecha */
    .single-post .entry-content {
        max-width: 100% !important; /* Usamos todo el ancho */
        margin: 10px auto !important; /* Menos margen arriba/abajo */
        padding: 30px 20px !important; /* Bajamos de 70px a 20px de aire lateral */
        box-shadow: none !important; /* En móvil las sombras pesadas ensucian */
        border-radius: 0 !important; /* Fuera esquinas, que fluya con el borde del tlf */
        border-left: none !important; /* Quitamos bordes laterales si los hubiera */
    }
    /* 2. Ajuste del título para que no sea gigante en el tlf */
    .single-post .entry-title {
        font-size: 32px !important; /* De 60px a algo humano para móvil */
        margin: 30px 15px 20px !important;
        padding: 0 10px !important;
    }
    /* 3. Las imágenes (Polaroids) al 100% */
    .single-post .entry-content figure.wp-block-image {
        margin: 20px -20px !important; /* Truco pro: la imagen rompe el margen del texto */
    }
    .single-post .entry-content figure.wp-block-image img {
        border-width: 8px !important; /* Marco más fino para que quepa más foto */
        width: 100% !important;
    }
 }	
/* --- BLOQUE DE CIERRE: ARGUINEGUÍN CTA --- */
/* 1. Títulos (H1, H2, H3) - Estilo Arena */
.single-post .entry-content .fondo h1,
.single-post .entry-content .fondo h2,
.single-post .entry-content .fondo h3 {
    color: #F2E8D5 !important;
    font-size: 40px !important;
    font-weight: 800 !important;
    letter-spacing: 1.5px !important;
    text-align: center !important;
    text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.6) !important;
    text-transform: none !important;
    margin-bottom: 15px !important;
}
/* 2. Párrafos (p) - Blanco Puro */
.single-post .entry-content .fondo p,
.single-post .entry-content .wp-block-cover.fondo p {
    color: #ffffff !important;
    font-size: 20px !important;
    line-height: 1.6 !important;
    text-align: center !important;
    text-shadow: 1px 1px 8px rgba(0, 0, 0, 0.7) !important;
    max-width: 700px !important;
    margin: 0 auto 25px auto !important;
}
/* 3. Contenedor del fondo (Ajuste de bordes) */
.wp-block-cover.fondo {
    border-radius: 4px !important;
    overflow: hidden !important;
}
/* ============================================================
   7. SECCIÓN FAQ YOAST: ESTILO ACORDEÓN PREMIUM 
   (Actualizado: Unificación de fuentes y protección de flecha)
   ============================================================ */
.schema-faq.wp-block-yoast-faq-block {
    max-width: 850px;
    margin: 40px auto;
}
.schema-faq-section {
    background-color: #ffffff;
    margin-bottom: 12px;
    border: 1px solid #eaeaea;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}
.schema-faq-section:hover {
    border-color: #d1d1d1;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    transform: translateY(-1px);
}
/* Contenedor de la Pregunta */
.schema-faq-question {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 20px 25px !important;
    font-size: 1.15rem !important;
    font-weight: 600 !important; /* Unificamos peso visual */
    color: #02142e !important;   /* Tu Navy Pro */
    margin: 0 !important;
    cursor: pointer;
    line-height: 1.4 !important;
}
/* Limpieza de negritas residuales de Yoast para que no bailen */
.schema-faq-question strong, 
.schema-faq-question b {
    font-weight: inherit !important;
    color: inherit !important;
    font-size: inherit !important;
}
/* La Flechita "Toda Chula" */
.schema-faq-question::after {
    content: '';
    width: 10px;
    height: 10px;
    border-right: 2px solid #d4a373; /* Tu color ARENA */
    border-bottom: 2px solid #d4a373;
    transform: rotate(45deg);
    transition: all 0.3s ease;
    margin-left: 15px;
    flex-shrink: 0; /* Evita que el texto la aplaste */
}
.schema-faq-section.faq-open {
    border-color: #d4a373; /* Borde arena al abrir */
}
.schema-faq-section.faq-open .schema-faq-question::after {
    transform: rotate(-135deg);
    border-color: #02142e; /* Cambia a navy al abrir para contraste */
}
/* La Respuesta */
.schema-faq-answer {
    max-height: 0;
    overflow: hidden;
    padding: 0 25px;
    color: #555;
    line-height: 1.7;
    transition: all 0.4s ease;
    opacity: 0;
}
.schema-faq-section.faq-open .schema-faq-answer {
    max-height: 1200px; /* Espacio de sobra para las 8 preguntas */
    padding-bottom: 25px;
    opacity: 1;
}
/* ========================================================
   MASTER CSS: FORMULARIOS BOUTIQUE ARGUINEGUÍN (UNIVERSAL)
   ======================================================== */
/* 1. CONTENEDOR Y ESTRUCTURA GLOBAL */
.wpforms-form {
    margin: 0 auto !important;
}
.wpforms-form .wpforms-field {
    margin-bottom: 20px !important; /* Espaciado elegante y compacto */
    padding: 0 !important;
}
/* 2. ETIQUETAS (LABELS) */
.wpforms-form .wpforms-field-label {
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    font-size: 13px !important;
    margin-bottom: 8px !important;
    color: #555 !important;
    display: block !important;
}
/* 3. CAMPOS DE ENTRADA (INPUTS, SELECT, TEXTAREA) */
.wpforms-form input[type="text"], 
.wpforms-form input[type="email"], 
.wpforms-form select, 
.wpforms-form textarea {
    border: 1px solid #eaeaea !important;
    border-radius: 2px !important;
    background-color: #fffdf9 !important; /* Blanco crema postal */
    padding: 14px 15px !important;
    font-size: 16px !important;
    color: #333 !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
/* Estilo específico para el desplegable con flecha minimalista */
.wpforms-form select {
    appearance: none !important;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22/%3E%3C/svg%3E') !important;
    background-repeat: no-repeat !important;
    background-position: right 15px top 50% !important;
    background-size: 12px auto !important;
    padding-right: 40px !important;
}
/* Efecto Focus (Oro Arena) */
.wpforms-form input:focus, 
.wpforms-form select:focus, 
.wpforms-form textarea:focus {
    border-color: #d4a373 !important;
    background-color: #ffffff !important;
    outline: none !important;
    box-shadow: 0 4px 12px rgba(212, 163, 115, 0.15) !important;
}
/* 4. BOTÓN "PLAYA VOLCÁNICA" XL */
.wpforms-form .wpforms-submit-container {
    text-align: left !important;
    padding-top: 15px !important;
}
.wpforms-form .wpforms-submit {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 2px solid #000000 !important;
    border-radius: 2px !important;
    padding: 18px 50px !important; 
    font-size: 18px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    box-shadow: 6px 6px 0px rgba(0,0,0,0.05) !important;
    cursor: pointer !important;
    display: inline-block !important;
    width: auto !important;
}
.wpforms-form .wpforms-submit:hover {
    background-color: #3d3028 !important;
    border-color: #3d3028 !important;
    color: #ffffff !important;
    transform: translate(-3px, -3px) !important;
    box-shadow: 10px 10px 0px rgba(212, 163, 115, 0.2) !important;
}
/* 5. MENSAJES DE ERROR Y PLACEHOLDERS */
.wpforms-form ::placeholder {
    color: #999 !important;
    opacity: 0.8;
    font-style: italic;
}
.wpforms-form label.wpforms-error {
    font-size: 12px !important;
    color: #cc0000 !important;
    font-weight: 600 !important;
    text-transform: none !important;
    margin-top: 4px !important;
}
/* 6. CONFIRMACIÓN: TARJETA BOUTIQUE */
.wpforms-confirmation-container {
    background-color: #fffdf9 !important;
    border: 2px solid #d4a373 !important;
    padding: 40px !important;
    border-radius: 2px !important;
    text-align: center !important;
    box-shadow: 8px 8px 0px rgba(212, 163, 115, 0.1) !important;
    margin-top: 20px !important;
    animation: fadeInForm 0.6s ease-out;
}
.wpforms-confirmation-container p {
    color: #3d3028 !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1.6 !important;
    letter-spacing: 0.5px !important;
}
@keyframes fadeInForm {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}
/* Hacer el texto de términos y condiciones más pequeño y discreto */
.woocommerce-terms-and-conditions-checkbox-text {
    font-size: 0.85em; /* Reduce el tamaño un 15% */
    color: #666;       /* Un gris más suave para que no resalte tanto */
}
.woocommerce-form__label-for-checkbox {
    margin-bottom: 10px; /* Espaciado suave */
}
/* Oculta cualquier párrafo que contenga el enlace de descarga de Complianz */
p:has(a[href*="complianz-terms-conditions"]),
h2:has(+ p a[href*="complianz-terms-conditions"]),
h3:has(+ p a[href*="complianz-terms-conditions"]) {
    display: none !important;
}
/* 1. Ajuste General Checkout (PC y Tablet) */
.cart-shipping td label {
    display: flex !important;
    justify-content: flex-end !important; /* Los junta a la derecha */
    align-items: center;
    font-size: 11px !important;
    color: #666 !important;
    width: 100%;
    gap: 10px; /* Distancia entre texto y precio */
}
/* 2. Para que el precio destaque siempre */
.cart-shipping td label .amount, 
.cart-shipping td .amount {
    font-size: 14px !important;
    color: #000 !important;
}
/* 3. Ajuste específico para MÓVIL (Donde el plugin quita el label) */
@media (max-width: 768px) {
    .cart-shipping td {
        display: flex !important;
        flex-direction: column !important; /* Texto arriba, precio abajo */
        align-items: flex-end !important;   /* Todo a la derecha */
        font-size: 11px !important;         /* Gris y pequeño */
        color: #666 !important;
        text-align: right !important;
    }
    .cart-shipping td .amount {
        margin-left: 0 !important;
        margin-top: 2px; /* Espacio entre el nombre y el precio */
    }
}
/* --- ARREGLO FINAL POP-UP ARGUINEGUÍN --- */ 
/* --- 1. ARREGLO DE LA X (ADIÓS AL RECTÁNGULO) --- */
.hustle_module_id_3 .hustle-button-close {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
/* Solo cambiamos el color del icono sin tocar su forma */
.hustle_module_id_3 .hustle-icon-close, 
.hustle_module_id_3 .hustle-icon-close span {
    color: #B0895D !important;
}
/* --- 2. CENTRADO Y FONDO --- */
.hustle_module_id_3 .hustle-popup-mask {
    background: rgba(0, 0, 0, 0.7) !important;
    width: 100vw !important;
    height: 100vh !important;
}
@media (min-width: 769px) {
    .hustle_module_id_3 .hustle-popup-content {
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        position: fixed !important;
    }
}
/* --- 3. FIX IPHONE (ZOOM Y CENTRADO) --- */
@media (max-width: 768px) {
    .hustle_module_id_3 .hustle-popup-content {
        width: 90% !important;
        left: 50% !important;
        top: 45% !important;
        transform: translate(-50%, -45%) !important;
        position: fixed !important;
    }
    /* EL TRUCO PARA EL ZOOM: 
       iPhone no hace zoom si la letra es de 16px */
    .input-email-iphone {
        -webkit-appearance: none !important;
        border-radius: 2px !important;
        border: 1px solid #ccc !important;
        padding: 14px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    /* Bloqueo total de movimiento de fondo */
    body.hustle-show {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
    }
}
/* --- 4. ESTILOS BOUTIQUE (LAVA) --- */
.titulo-pop { color: #1a1a1a !important; font-size: 22px !important; font-weight: 700 !important; text-align: center; }
.texto-pop { color: #555 !important; font-size: 14px !important; text-align: center; line-height: 1.5; }
.boton-lava {
    -webkit-appearance: none !important;
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 2px solid #000000 !important;
    padding: 16px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    width: 100% !important;
    box-shadow: 4px 4px 0px rgba(0,0,0,0.05) !important;
    cursor: pointer !important;
}
.boton-lava:hover {
    background-color: #3D3028 !important;
    color: #ffffff !important;
}
.legal-pop { font-size: 11px !important; color: #888 !important; display: flex !important; gap: 8px; justify-content: center; }
.legal-pop a { color: #3D3028 !important; text-decoration: underline !important; }
@media (max-width: 768px) {
    .input-email-iphone {
        /* 1. Ponemos la fuente a 18px para que Safari se relaje por completo */
        font-size: 18px !important; 
        /* 2. Escalamos el input hacia abajo para que se vea como si fuera de 14px-15px */
        transform: scale(0.9); 
        transform-origin: left center;
        /* 3. Compensamos el ancho para que no se vea corto al encogerlo */
        width: 111% !important; 
        height: 52px !important;
        -webkit-appearance: none !important;
        border: 1px solid #ccc !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
        border-radius: 2px !important;
        background-color: #ffffff !important;
    }
}
/* --- FORMULARIOS GRANDE EN VISTA MOVIL --- */
@media (max-width: 768px) {
    /* Altura y accesibilidad para WPForms y Brevo */
    .wpforms-field input, 
    .wpforms-field select, 
    .wpforms-field textarea,
    .sib-input,
    .sib-select select {
        /* Altura generosa para dedos senior */
        height: 60px !important; 
        font-size: 18px !important;      
        /* Tu truco para el zoom de iPhone */
        transform: scale(0.9);
        transform-origin: left center;
        width: 111% !important; 
        /* Centrado del texto */
        padding: 0 20px !important;
        line-height: 60px !important;
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
    }
    /* Ajuste para el cuadro de mensaje o comentarios */
    .wpforms-field textarea,
    textarea.sib-input {
        height: auto !important;
        min-height: 140px !important;
        line-height: 1.5 !important;
        padding: 15px 20px !important;
    }
    /* Forzamos que los contenedores no asfixien los campos */
    .wpforms-field-container, .sib-form-block {
        width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
/* --- BREVO check box --- */
/* Corregir tamaño y forzar una sola línea en el checkbox de Brevo */
#ws_opt_in_field label.checkbox {
    font-size: 12px !important;
    width: 100% !important; /* Usar todo el ancho disponible */
    display: flex !important; /* Alinea checkbox y texto mejor */
    align-items: flex-start !important;
    white-space: nowrap !important; /* Evita que el texto salte de línea */
}
/* Espacio entre el cuadradito y el texto */
#ws_opt_in_field input.input-checkbox {
    margin-right: 8px !important;
    margin-top: 2px !important;
}
/* Reducir el espacio entre los párrafos de privacidad, términos y news */
.woocommerce-checkout #payment .form-row.terms, 
#ws_opt_in_field {
    margin-bottom: 5px !important;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}
/* Ajuste fino para la posición del texto respecto al checkbox */
#ws_opt_in_field label.checkbox {
    line-height: 1.2 !important;
    margin-bottom: 0 !important;
}
/* Espacio extra entre la casilla de noticias y el boton de pago */
#place_order {
    margin-top: 20px !important;
}
/* ============================================================
    CANDADO FINAL PARA iPHONE (CORREGIDO)
   ============================================================ */
/* 1. Bloqueo de scroll lateral sin romper el ancho de Astra */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}
/* 2. Corregimos el contenedor: Quitamos el 100% que lo estiraba */
#page, .site, .site-content {
    overflow-x: hidden !important;
    position: relative !important;
}
/* 3. FIX DE LAS TARJETAS (FIELDSET) - COMPORTAMIENTO PROFESIONAL */
fieldset.ast-single-product-payments {
    display: block !important;
    width: fit-content !important; 
    max-width: 100% !important; 
    min-height: 85px !important; 
    /* Margen por defecto: Pegado a la izquierda (PC) */
    margin: 20px 0 !important; 
    padding: 15px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    box-sizing: border-box !important;
    overflow: hidden;
}
/* Alineación de la lista y el título */
fieldset.ast-single-product-payments ul {
    display: flex !important;
    flex-wrap: wrap !important; 
    gap: 10px !important; 
    padding: 0 !important;
    margin: 0 !important;
    justify-content: flex-start !important; /* Alineado a la izquierda en PC */
    list-style: none !important;
}
fieldset.ast-single-product-payments legend {
    width: auto !important;
    padding: 0 10px !important;
    font-size: 13px !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}
/* Control de logos (SVG e Imágenes PNG) */
fieldset.ast-single-product-payments li.ast-custom-payment {
    width: 45px !important; 
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
fieldset.ast-single-product-payments svg,
fieldset.ast-single-product-payments img {
    width: 45px !important;
    height: auto !important;
    max-height: 28px !important;
    object-fit: contain !important;
    background: transparent !important;
    background-color: transparent !important; /* Doble seguro para PNGs */
}
/* --- AJUSTE EXCLUSIVO PARA MÓVILES --- */
@media (max-width: 768px) {
    fieldset.ast-single-product-payments {
        margin: 20px auto !important; /* Centramos la caja entera en el móvil */
    }
    fieldset.ast-single-product-payments ul {
        justify-content: center !important; /* Centramos los iconos dentro */
    }
    fieldset.ast-single-product-payments legend {
        text-align: center !important;
        margin: 0 auto !important;
    }
}
/* 4. Evitar que los formularios rompan la web */
.hustle_module_id_3, .wpforms-container, .sib-form-block {
    max-width: 100% !important;
    overflow: hidden !important;
}
/* --- FILTRO DE CONTRASTE UNIVERSAL + HOVER PRO --- */
/* 1. Cambio automático de grises claros a Gris Volcánico legible */
[style*="color: #777"], 
[style*="color: #777777"],
[style*="color: #666"],
[style*="color: #666666"],
.ast-secondary-text,
.breadcrumb,
.woocommerce-breadcrumb,
.reset_variations,
.footer-widget-area .menu-link {    
    color: #544d48 !important;
    transition: color 0.3s ease !important; /* Transición suave */
}
/* 2. Forzamos el cambio en los enlaces que usen esos colores */
a[style*="color: #777"], 
a[style*="color: #666"],
.woocommerce-breadcrumb a,
.reset_variations,
.footer-widget-area .menu-link {
    color: #544d48 !important;
	opacity: 1 !important;
}
/* 3. EFECTO HOVER UNIVERSAL (NAVY PRO + SUBRAYADO) */
/* Se activa en los enlaces que antes eran grises y ahora son legibles */
a[style*="color: #777"]:hover, 
a[style*="color: #666"]:hover,
.woocommerce-breadcrumb a:hover,
.reset_variations:hover,
.footer-widget-area .menu-link:hover { 
    color: #02142e !important; /* Tu Navy Pro */
    text-decoration: underline !important;
    text-underline-offset: 3px; /* Separa un poco la línea para que sea elegante */
}
/* ARREGLO CATEGORÍAS Y FILTROS (SIN HOVER) */
.ast-woo-product-category, 
.wc-layered-nav-rating a {
    color: #544d48 !important;
	opacity: 1 !important; /* Esto quita el efecto "transparente" */
    display: block !important; /* Asegura que se apliquen bien los estilos */
}
/* =========================================================
   MASTER CSS: CHECKOUT ARGUINEGUÍN (CARTFLOWS + WOO)
   ========================================================= */
/* 1. CAMPOS DE TEXTO: Lo que el usuario escribe (Nombre, Notas, etc) */
.wcf-embed-checkout-form input.input-text,
.wcf-embed-checkout-form textarea.input-text,
.wcf-embed-checkout-form select {
    color: #544d48 !important;
}
/* 2. DESPLEGABLE DE PAÍSES (Select2) */
.wcf-embed-checkout-form .select2-container .select2-selection--single .select2-selection__rendered {
    color: #544d48 !important;
}
/* 3. PLACEHOLDERS: Textos de ejemplo forzados para todo navegador */
.wcf-embed-checkout-form input.input-text::-webkit-input-placeholder,
.wcf-embed-checkout-form textarea.input-text::-webkit-input-placeholder {
    color: #544d48 !important;
    opacity: 1 !important;
}
.wcf-embed-checkout-form input.input-text::-moz-placeholder,
.wcf-embed-checkout-form textarea.input-text::-moz-placeholder {
    color: #544d48 !important;
    opacity: 1 !important;
}
.wcf-embed-checkout-form input.input-text::placeholder,
.wcf-embed-checkout-form textarea.input-text::placeholder {
    color: #544d48 !important;
    opacity: 1 !important;
}
/* 4. MÉTODOS DE ENVÍO: Solo el texto "Free Shipping" */
.wcf-embed-checkout-form .cart-shipping td label,
.wcf-embed-checkout-form ul#shipping_method li label {
    color: #544d48 !important;
}
/* 5. CHECKBOX NEWSLETTER (BREVO) */
.wcf-embed-checkout-form #ws_opt_in_field label.checkbox {
    color: #544d48 !important;
}
/* 6. TEXTOS LEGALES Y TÉRMINOS */
.wcf-embed-checkout-form .woocommerce-terms-and-conditions-checkbox-text,
.wcf-embed-checkout-form .woocommerce-terms-and-conditions-checkbox-text a {
    color: #544d48 !important;
    opacity: 1 !important;
}
/* Forzar visibilidad inmediata de la galería SVI para mejorar el LCP */
.gallery-svi, .svistatic .svi-mainsection img {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}
/* --- CEMENTO ARMADO ANTI-CLS + GALERÍA MÓVIL SIN HUECOS --- */
/* 1. CONFIGURACIÓN ESCRITORIO */
.ast-single-product-image,
.woocommerce-product-gallery,
.gallery-svi {
    display: block !important;
    float: left !important; 
    width: 100% !important;
    max-width: 600px !important; 
}
@media (min-width: 769px) {
    .ast-single-product-image,
    .woocommerce-product-gallery,
    .gallery-svi,
    .svi-mainsection {
        min-height: 600px !important;
    }
}
/* 2. VISIBILIDAD (Tu regla maestra) */
.woocommerce-product-gallery img,
.svi-mainsection img,
.flex-viewport {
    opacity: 1 !important;
    visibility: visible !important;
}
/* 3. CONTROL DE PESTAÑAS ANTI-SALTOS */
#content .woocommerce-tabs,
.ast-woocommerce-container .woocommerce-tabs {
    clear: both !important;
    display: block !important;
    width: 100% !important;
    padding-top: 40px !important; 
}
/* 4. ELIMINACIÓN DEL PARCHE BLANCO EN MÓVIL (ATACANDO EL INLINE STYLE) */
@media (max-width: 768px) {
    /* Atacamos directamente al div que tiene el min-height: 600px en tu código */
    .svi-mainsection {
        min-height: 350px !important; /* Ganamos al estilo en línea de SVI */
        height: 350px !important;
        margin-bottom: 0 !important;
        padding: 0 !important;
    }
    .ast-single-product-image,
    .woocommerce-product-gallery,
    .gallery-svi {
        min-height: auto !important;
        height: auto !important;
        margin-bottom: 10px !important;
        overflow: visible !important;
    }
    /* Ajustamos la imagen y el visor al nuevo alto */
    .svi-mainsection img,
    .woocommerce-product-gallery .flex-viewport,
    .woocommerce-product-gallery .flex-viewport img {
        max-height: 350px !important;
        height: 350px !important;
        object-fit: contain !important;
        width: auto !important;
        margin: 0 auto !important;
    }
    /* Las miniaturas ahora subirán porque hemos matado el min-height del padre */
    .svithumbnails, 
    .svi-thumbsection {
        margin-top: 5px !important;
        padding: 0 !important;
    }
    /* El resumen del producto (título/precio) sube a su sitio */
    .summary.entry-summary {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}
/* --- JERARQUÍA VISUAL: PÁRRAFOS VS LISTAS TIENDA --- */
/* 1. Párrafos principales (21px) */
.woocommerce-product-details__short-description p,
.woocommerce-Tabs-panel--description p {
    font-size: 19px !important;
    line-height: 1.6 !important;
    color: #333 !important;
    margin-bottom: 20px !important;
}
/* 2. Listas de características (20px) */
.woocommerce-product-details__short-description li,
.woocommerce-Tabs-panel--description li {
    font-size: 18px !important;
    line-height: 1.5 !important;
    color: #444 !important; /* Un gris sutilmente más suave */
}
/* Espacio extra entre puntos de la lista para que respiren en móvil */
.woocommerce-product-details__short-description li,
.woocommerce-Tabs-panel--description li {
    margin-bottom: 15px !important;
}
/* 1. Forzar color oscuro al logo blanco en el Checkout */
.woocommerce-checkout .main-header--site-logo img,
.cartflows-instant-checkout .main-header--site-logo img {
    filter: brightness(0) saturate(100%) invert(0%) !important;
    width: 130px !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
}
/* 2. Evitar el "fogonazo" reservando el espacio exacto del contenedor */
.main-header--site-logo {
    display: inline-block !important;
    width: 130px !important;
    height: 50px !important; /* Ajustado a tu proporción 260x91 */
    vertical-align: middle;
}
/* Centrar el logo en la cabecera del Checkout/Carrito */
.woocommerce-checkout .main-header--content,
.woocommerce-cart .main-header--content {
    display: flex !important;
    justify-content: center !important; /* Centrado horizontal */
    align-items: center !important;    /* Centrado vertical */
    text-align: center !important;
}
.woocommerce-checkout .main-header--site-logo,
.woocommerce-cart .main-header--site-logo {
    margin: 0 auto !important; /* Refuerzo de centrado */
    float: none !important;    /* Anulamos posibles flotados de Astra */
}
/* --- UP --- */
/* --- AJUSTE FINAL PRODUCTO (Arguineguín Souvenirs) --- */
/* 1. SVI y Breadcrumbs (Incluye tu nuevo cambio) */
.gallery-svi.woocommerce-product-gallery {
    margin-bottom: 0 !important;
}
.svi_wrapper.svi-app-ready {
    margin-bottom: -15px !important;
}
.woosvi_strap.svi-astra {
    margin-bottom: 0 !important;
}
.woocommerce-js .woocommerce-breadcrumb {
    zoom: 1 !important;
    margin: 0 0 0.5em !important; /* Tu ajuste: 0 arriba, 0 lados, 0.5 abajo */
}
/* 2. Guía de Tallas (Snippet) */
.caja-guia-medidas {
    margin-top: 15px !important; 
    margin-bottom: -5px !important;
    padding: 0 !important;
    line-height: 1 !important;
}
.woocommerce-product-details__short-description {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
.caja-guia-medidas button.wpb-psc-table-fire {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 8px !important; 
}
/* 3. Variaciones (Bloque de swatches) */
form.variations_form.cart {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* 4. Bloque de Pagos y Tarjetas (Elimina el parche blanco del reCAPTCHA) */
.wcpay-express-checkout-wrapper {
    margin: 0 !important;
    padding: 0 !important;
}
fieldset.ast-single-product-payments {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 10px !important;
    padding-bottom: 0 !important;
}
.ast-single-product-payments ul {
    margin-bottom: 0 !important;
}
#ppcp-recaptcha-v2-container {
    margin: 0 !important; 
    padding: 0 !important;
    display: block !important;
    height: auto !important;
}
/* 5. Columna Summary y Pestañas (Tu descubrimiento del margin-bottom) */
.woocommerce-js div.product div.summary {
    margin-bottom: 0 !important;
}
.woocommerce-tabs.wc-tabs-wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* 6. Limpieza de elementos vacíos */
#payment-method-message,
.woocommerce-variation-price:empty,
.woocommerce-variation-availability:empty {
    display: none !important;
}
/* --- AJUSTES TEXTOS MÓVIL (Solo para Smartphones) --- */
@media (max-width: 767px) {
    /* 1. Título del Producto */
    .product_title.entry-title {
        font-size: 32px !important; /* Ajusta a tu gusto */
        line-height: 1.2 !important;
        margin-bottom: 10px !important;
    }
    /* 2. Precio Principal */
    .summary .price .woocommerce-Price-amount {
        font-size: 30px !important;
        font-weight: 700 !important;
    }
    /* 3. Texto de "Taxes included" y "Approx" */
    .summary .price small, 
    .summary .price span[style*="display: block"] {
        font-size: 16px !important; /* Un poco más grandes para que se lean bien */
        line-height: 1.4 !important;
    }
    /* 5. Texto de la Guía de Tallas */
    .caja-guia-medidas button.wpb-psc-table-fire {
        font-size: 15px !important;
        font-weight: 600 !important;
    }
    /* 6. Botón Añadir al Carrito */
    .single_add_to_cart_button.button {
        font-size: 20px !important;
        padding: 15px !important; /* Más alto para que sea fácil de pulsar */
    }
}
/* AJUSTES SWATCHES MÓVIL DEFINITIVOS */
@media (max-width: 767px) {
    /* 1. Base común */
    .cfvsw-swatches-container .cfvsw-swatches-option {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 4px !important;
        margin: 0 !important;
    }
/* 2. TALLAS Fila Única Blindada (Solo corregido el nombre) */
.cfvsw-swatches-container[swatches-attr="attribute_pa_size"] {
    display: flex !important;
    flex-wrap: nowrap !important; 
    overflow-x: auto !important; 
    gap: 12px !important; 
    padding: 10px 2px !important;
    -webkit-overflow-scrolling: touch !important;
}
.cfvsw-swatches-option[swatches-attr="attribute_pa_size"] .cfvsw-swatches-option {
    flex: 0 0 48px !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
}
    /* 3. COLORES Rejilla estándar */
    .cfvsw-swatches-container[swatches-attr="attribute_pa_color"] {
        display: flex !important;
        flex-wrap: wrap !important; 
        gap: 15px !important; 
        padding: 10px 0 !important;
    }
    .cfvsw-swatches-container[swatches-attr="attribute_pa_color"] .cfvsw-swatches-option {
        width: 62px !important;
        height: 62px !important;
        min-width: 62px !important;
        margin-bottom: 5px !important;
    }
    /* 4. Tipografía y Relleno */
    .cfvsw-swatches-option .cfvsw-swatch-inner {
        width: 100% !important;
        height: 100% !important;
        font-size: 18px !important; 
        font-weight: 800 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    /* 5. Etiquetas */
    .variations th.label label, 
    .cfvsw-selected-label {
        font-size: 18px !important;
        font-weight: 700 !important;
        display: block !important;
        margin-bottom: 8px !important;
    }
    /* Limpieza de scroll */
    .cfvsw-swatches-container[swatches-attr="attribute_size"]::-webkit-scrollbar {
        display: none !important;
    }
}
/* PARCHE Reducción para móviles estrechos Xiaomi o iPhone SE */
@media (max-width: 380px) {
    .cfvsw-swatches-container[swatches-attr="attribute_size"] .cfvsw-swatches-option {
        flex: 0 0 44px !important; 
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
    }
    .cfvsw-swatches-container[swatches-attr="attribute_size"] {
        gap: 8px !important; 
    }
}
@media (max-width: 767px) {
    /* Dar un poco de respiro entre secciones para que no parezca un bloque de texto infinito */
    .caja-guia-medidas {
        border-bottom: 1px solid #f4f4f4; /* Una línea casi invisible para separar */
        padding-bottom: 10px !important;
        margin-bottom: 10px !important;
    }
    .variations_form.cart {
        padding-top: 10px !important; /* Aire después de la guía de tallas */
    }
    /* El botón de añadir al carrito necesita "aire" arriba para no pegarse a los colores */
    .woocommerce-variation-add-to-cart {
        margin-top: 20px !important;
    }
}
/* Ajuste para los logos PNG (Apple y Google) en la caja de pagos */
fieldset.ast-single-product-payments li.ast-custom-payment img {
    width: 45px !important;
    height: 30px !important; /* Obligamos a que tengan la misma altura que la caja */
    object-fit: contain !important; /* Evita que la manzana o la G se deformen */
    background: transparent !important; /* Fulmina el fondo del tema */
    background-color: transparent !important; /* Doble seguro contra el Lazy Load */
    box-shadow: none !important; /* Quitamos bordes raros */
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
/* --- BARRA COMPRA MÓVIL OPTIMIZADA (Arguineguín Signature) --- */
@media (max-width: 767px) {
    .ast-sticky-add-to-cart {
        background: #fffdf9 !important;
        box-shadow: 0 -4px 20px rgba(61, 48, 40, 0.2) !important;
        padding: 10px 12px !important; /* Un poco más de aire lateral */
        min-height: 80px !important; 
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    .ast-sticky-add-to-cart-content,
    .ast-sticky-add-to-cart-action-wrap {
        display: none !important;
    }
    .botones-movil-wrap {
        display: flex !important;
        width: 100% !important;
        gap: 10px !important; 
        align-items: center !important;
    }
    .btn-opciones-fijo, .cloned-sticky-btn {
        height: 60px !important;
        border-radius: 6px !important;
        text-transform: uppercase !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }
    /* Botón OPTIONS: Se queda en un segundo plano elegante */
    .btn-opciones-fijo {
        flex: 1 !important; 
        background: #fffdf9 !important;
        color: #3d3028 !important;
        border: 2px solid #3d3028 !important;
        font-size: 13px !important; /* Fuente secundaria */
        font-weight: 700 !important;
        padding: 0 5px !important;
        letter-spacing: -0.1px !important;
    }
    /* Botón ADD TO CART: El "Tanque" de la conversión */
    .cloned-sticky-btn {
        flex: 2.5 !important; /* Le damos mucho más espacio proporcional */
        background: #3d3028 !important;
        color: #fffdf9 !important;
        border: none !important;
        font-size: 16px !important; /* Forzamos tamaño grande de nuevo */
        font-weight: 900 !important; /* Peso máximo para que la letra tenga "pegada" */
        padding: 0 12px !important;
        letter-spacing: -0.3px !important; /* Compresión técnica para evitar el salto de línea en el Redmi */
        box-shadow: 0 4px 10px rgba(61, 48, 40, 0.3) !important; /* Un poco de profundidad */
    }
}
/* --- VISTA ESCRITORIO (Astra Original) --- */
@media (min-width: 768px) {
    .botones-movil-wrap {
        display: none !important;
    }
    .ast-sticky-add-to-cart-content,
    .ast-sticky-add-to-cart-action-wrap {
        display: flex !important;
    }
}
/* --- ESTADO SELECCIONADO: TALLAS (Efecto Volcánico) --- */
/* 1. El contenedor cuando está seleccionado (Corregido a attribute_pa_size) */
.cfvsw-swatches-container[swatches-attr="attribute_pa_size"] .cfvsw-swatches-option.cfvsw-selected-swatch {
    background-color: #3d3028 !important; 
    border-color: #3d3028 !important;
    box-shadow: 0 4px 8px rgba(61, 48, 40, 0.3) !important; 
    transform: scale(1.05); 
    transition: all 0.2s ease-in-out;
}
/* 2. La letra dentro del cuadro seleccionado (Corregido a attribute_pa_size) */
.cfvsw-swatches-container[swatches-attr="attribute_pa_size"] .cfvsw-selected-swatch .cfvsw-swatch-inner {
    color: #fffdf9 !important; 
}
/* 3. El punto o check que a veces pone el plugin */
.cfvsw-selected-swatch::after {
    display: none !important;
}
/* EFECTO PASAR EL RATON POR LAS TALLAS EN ORDENADOR */
.cfvsw-swatches-container[swatches-attr="attribute_pa_size"] .cfvsw-swatches-option:not(.cfvsw-selected-swatch):hover {
    border-color: #3d3028 !important; 
    box-shadow: 0 4px 8px rgba(61, 48, 40, 0.15) !important; 
    transform: scale(1.03); 
    transition: all 0.2s ease-in-out;
    cursor: pointer !important;
}
/* Subir la intensidad del texto al señalar con el raton */
.cfvsw-swatches-container[swatches-attr="attribute_pa_size"] .cfvsw-swatches-option:not(.cfvsw-selected-swatch):hover .cfvsw-swatch-inner {
    color: #3d3028 !important;
}
/* ============================================================
   AJUSTE DE CONTRASTE: SOLO COLORES VOLCÁNICOS Y ARENA
   ============================================================ */
/* 1. CORRECCIÓN DEL COLOR ELEGIDO (CURRENT): FONDO VOLCÁNICO, LETRA BLANCA */
/* Actuamos sobre el span que tiene la clase current dentro del li */
.page-numbers.current {
    background-color: #3d3028 !important; /* Marrón Volcánico Arguineguín */
    color: #ffffff !important;            /* Blanco puro para máxima legibilidad */
    border-color: #3d3028 !important;
}
/* 2. CORRECCIÓN DEL HOVER (A): FONDO ARENA, LETRA BLANCA */
/* Actuamos sobre los enlaces (a) al pasar el cursor */
a.page-numbers:hover {
    background-color: #d4a373 !important; /* Color Arena Arguineguín */
    color: #ffffff !important;
    border-color: #d4a373 !important;
}
/* 3. BLOQUEO DE COLOR AL HACER CLIC (ACTIVE / FOCUS) */
/* Evitamos que al pulsar vuelva el color ilegible */
a.page-numbers:active, 
a.page-numbers:focus {
    background-color: #3d3028 !important; /* Mantenemos el volcánico al clicar */
    color: #ffffff !important;
    border-color: #3d3028 !important;
    outline: none !important; /* Eliminamos el recuadro azul por defecto del navegador */
}
/* ============================================================
   ESTILO BARRA DE RESULTADOS (CONTADOR Y ORDENACIÓN)
   ============================================================ */
/* 2. DESPLEGABLE DE ORDENACIÓN (Select) */
.woocommerce-ordering select.orderby {
    background-color: #ffffff !important;
    color: #3d3028 !important; /* Texto volcánico profundo */
    border: 1px solid #eaeaea !important;
    border-radius: 2px !important; /* Esquinas casi rectas estilo boutique */
    padding: 8px 15px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    outline: none !important;
}
/* 3. EFECTO HOVER EN EL DESPLEGABLE */
.woocommerce-ordering select.orderby:hover,
.woocommerce-ordering select.orderby:focus {
    border-color: #d4a373 !important; /* Borde color Arena al interactuar */
    box-shadow: 0 2px 8px rgba(212, 163, 115, 0.15) !important;
}
/* NOTA REINA UNIVERSAL (Visible en PC y Móvil) */
/* 1. VISTA PC (Pequeña y elegante) */
@media (min-width: 769px) {
    .single-post .entry-content p.nota-reina {
        font-size: 14px !important;
        line-height: 1.5 !important;
        font-style: italic !important;
        text-align: center !important;
        color: #3d3028 !important;
		 box-sizing: border-box !important;
    }
}
/* 2. VISTA MÓVIL (Como la tenías antes, grande y legible) */
@media (max-width: 768px) {
    .single-post .entry-content p.nota-reina {
        display: block !important;
        text-align: center !important; 
        font-size: 18px !important; /* Recuperamos tus 20px */
        line-height: 1.6 !important;
        font-style: italic !important;
		 box-sizing: border-box !important;
    }
}
/* Ocultar pestaña y contenedor de valoraciones temporalmente */
.woocommerce div.product .woocommerce-tabs ul.tabs li.reviews_tab {
    display: none !important;
}
.woocommerce div.product .woocommerce-tabs .panel#tab-reviews {
    display: none !important;
}
/* 1. Resetear la altura forzada que bloquea a Chrome */
html, body {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    position: relative !important;
}
/* 2. Corregir el contenedor específico de CartFlows */
.wcf-cartflows-checkout, 
#wcf-embed-checkout-form,
.wcf-main-container,
.cartflows-checkout-main-wrapper { 
    height: auto !important;
    display: block !important;
    overflow: visible !important;
    touch-action: pan-y !important; /* El cambio clave para el scroll */
}
/* 3. Asegurar que el formulario de WooCommerce sea elástico */
.woocommerce-checkout {
    height: auto !important;
    overflow: visible !important;
}
/* Ocultar el logo deformado solo en la página de carrito */
.woocommerce-cart .site-logo-img {
    display: none !important;
}

/* Opcional: Si quieres que aparezca el nombre de la tienda en texto en su lugar */
.woocommerce-cart .ast-site-title-wrap {
    display: block !important;
}
/* Truncar títulos en tienda y shortcodes a 1 sola línea */
.woocommerce-loop-product__title {
    display: -webkit-box;
    -webkit-line-clamp: 1; 
    -webkit-box-orient: vertical;  
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 1.2em; /* Mantiene la alineación si hay nombres muy cortos */
}
/* Recreación del estilo compacto y fuerte original */
body .elementor-element.subtitle-hero .elementor-heading-title {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important; /* Bajamos a 10px para que se vea pequeño */
    font-weight: 700 !important; /* Subimos a 700 para que la negrita destaque más */
    line-height: 1.25em !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    color: #FFFFFF !important;
    
    /* Esto ayuda a que en algunos navegadores se vea más nítido y "fuerte" */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
}
/* Forzamos el reset del contenedor */
.elementor-element.subtitle-hero {
    margin: 0 !important;
    padding: 0 !important;
}
/* Espaciado exclusivo para móviles (pantallas de menos de 768px) */
@media (max-width: 767px) {
    .elementor-element.subtitle-hero {
        margin-bottom: 8px !important; /* Ajusta este valor para separar más o menos del H1 */
		font-weight: 400 !important; /* Más negrita que en escritorio */
		/* Truco para engrosar la letra artificialmente */
        -webkit-text-stroke: 0.2px #FFFFFF; 
        text-shadow: 0.2px 0 0 #FFFFFF, -0.2px 0 0 #FFFFFF; /* Engrosa horizontalmente */
    }
}
/* Espacio más sutil entre los puntos de la lista */
.wp-block-list li {
    margin-bottom: 10px !important; 
}
.wp-block-list li:last-child {
    margin-bottom: 0 !important;
}
/* ============================================= */
/* 1. ESTILOS GENERALES (Flecha) - UNIVERSAL */
/* ============================================= */
.widget_nav_menu .menu-item-has-children .ast-header-navigation-arrow::before {
    content: "\25BE" !important;
    display: inline-block !important;
    margin-left: 8px !important;
    font-size: 14px !important;
    transition: transform 0.3s ease !important;
}
/* ============================================= */
/* DESKTOP FOOTER - Versión Limpia y Consolidada */
/* ============================================= */
@media (min-width: 922px) {
    .widget_nav_menu .menu-item-has-children {
        position: relative !important;
    }
    .widget_nav_menu .sub-menu {
        display: none !important;
        position: absolute !important;
        left: 0 !important;
        top: 100% !important;
        background: #ffffff !important;
        
        /* Dimensiones exactas y controladas */
        width: 200px !important;
        min-width: 200px !important;
        max-width: 200px !important;
        padding: 12px 15px !important;
        margin: 0 !important;
        box-shadow: 0 8px 20px rgba(0,0,0,0.12) !important;
        border-radius: 5px !important;
        list-style: none !important;
        z-index: 9999 !important;
        box-sizing: border-box !important; /* IMPORTANTE: evita que el padding expanda el ancho */
    }
    /* Puente invisible para hover */
    .widget_nav_menu .sub-menu::before {
        content: "" !important;
        position: absolute !important;
        top: -15px !important;
        left: 0 !important;
        width: 100% !important;
        height: 15px !important;
    }
    .widget_nav_menu .menu-item-has-children:hover > .sub-menu {
        display: block !important;
        animation: fadeIn 0.2s ease-out !important;
    }
    .widget_nav_menu .sub-menu .menu-link {
        color: #333 !important;
        padding: 8px 0 !important;
        display: block !important;
        white-space: nowrap !important; /* Evita que el texto estire la caja */
    }
    /* Rotación flecha en hover */
    .widget_nav_menu .menu-item-has-children:hover .ast-header-navigation-arrow::before {
        transform: rotate(180deg) !important;
    }
}
/* ============================================= */
/* MÓVIL FOOTER - Versión Pro Universal (Funciona en todos los idiomas) */
/* ============================================= */
@media (max-width: 921px) {
    /* Ocultar submenú por defecto */
    .widget_nav_menu .sub-menu {
        display: none !important;
        position: static !important;
        padding: 10px 18px !important;
        background: #F0FAFF !important;
        box-shadow: none !important;
        margin: 4px 0 12px 0 !important;
        width: 100% !important;
    }
    /* Mostrar al activar clase JS */
    .widget_nav_menu .menu-item-has-children.abierto-pro > .sub-menu {
        display: block !important;
    }
    /* Flecha (el botón que pulsa el usuario) */
    .widget_nav_menu .ast-header-navigation-arrow {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 36px !important;
        height: 22px !important;
        background: #ffffff !important;
        border: 1px solid rgba(0,0,0,0.1) !important;
        border-radius: 6px !important;
        position: absolute !important;
        right: 12px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        cursor: pointer !important;
        z-index: 10 !important;
    }
    .widget_nav_menu .ast-header-navigation-arrow::before {
        content: "\25BE" !important;
        font-size: 19px !important;
        color: #333 !important;
        line-height: 1 !important;
    }
    /* Rotación de flecha */
    .widget_nav_menu .menu-item-has-children.abierto-pro .ast-header-navigation-arrow::before {
        transform: rotate(180deg) !important;
    }
    /* Ajuste del link para dejar espacio a la flecha */
    .widget_nav_menu .menu-item-has-children > .menu-link {
        padding-right: 58px !important;
        position: relative !important;
    }
}
/* MENU TIENDA Contenedor general */
.nav-chips-container {
    margin-bottom: 0;
}
.chips-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
	 justify-content: center;
}
.chips-list li a {
    text-decoration: none;
    transition: all 0.3s ease;
    font-weight: 500;
}
/* Fila de Zonas: Estilo Píldora Souvenir */
.zonas-row .chips-list li a {
    padding: 8px 18px;
    background: #f8f8f8;
    border: 1px solid #e0e0e0;
    border-radius: 30px;
    font-size: 14px;
    color: #0f172a;
}
/* Fila de Calidades: Estilo Técnico/Moda */
.calidades-row .chips-list li a {
    padding: 6px 14px;
    background: #fff;
    border: 1px solid #000;
    border-radius: 4px; /* Cuadrado sutil */
    font-size: 13px;
    color: #0f172a;
    text-transform: uppercase;
}
/* Estados Activos y Hovers */
.chips-list li a.is-active, 
.chips-list li a:hover {
    background: #3d3028 !important;
    color: #fff !important;
    border-color: #3d3028 !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
/* Ajuste móvil: scroll horizontal si hay muchos chips */
@media (max-width: 600px) {
    .chips-list {
        flex-wrap: nowrap;
        overflow-x: auto;
       padding: 5px 0 10px 0;
        -webkit-overflow-scrolling: touch;
			justify-content: flex-start;
    }
    .chips-list li {
        flex: 0 0 auto;
    }
}
/* Fila de Hijos: Estilo Sutil */
.hijos-row .chips-list li a {
    padding: 6px 14px;
    background: #ffffff;
    border: 1px dashed #ccc; /* Un borde discontinuo para diferenciarlo */
    border-radius: 8px;
    font-size: 13px;
    color: #666;
}
.categories-row .chips-list li a {
    padding: 7px 15px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 13px;
    color: #0f172a;
}
/* Fila de Subzonas (Meloneras, Amadores...) */
.subzonas-row .chips-list li a {
    padding: 6px 14px;
    background: #fff;
    border: 1px solid #3498db; /* Un color sutil para indicar sub-nivel */
    border-radius: 20px;
    font-size: 13px;
    color: #3498db;
}
.subzonas-row .chips-list li a:hover {
    background: #3d3028 !important;
    color: #fff !important;
}
/* Espaciado del contenedor general (Escritorio) */
.shop-navigation-wrapper {
    display: flex;
    flex-direction: column;
    gap: 12px; /* Espacio moderado entre filas en PC */
    margin-bottom: 10px;
}
/* Ajuste específico para afinar el espacio vertical en móviles */
@media (max-width: 600px) {
    .shop-navigation-wrapper {
        gap: 8px; /* Espacio mucho más reducido y compacto en el móvil */
		margin-bottom: 0px;
    }
}
/* Destacar Volcano (el primer elemento de las zonas) */
.zonas-row .chips-list li:first-child a {
    background: #9b2226; /* Color base para destacar la colección premium */
    color: #fff;
    border-color: #9b2226;
}
/* Mantener tu color corporativo cuando el usuario interactúa con Volcano */
.zonas-row .chips-list li:first-child a.is-active,
.zonas-row .chips-list li:first-child a:hover {
    background: #3d3028 !important;
    border-color: #3d3028 !important;
    color: #fff !important;
}
/* --- REDUCIR ESPACIO DE LA CABECERA (SOLO EN TIENDA Y CATEGORÍAS) --- */
/* 1. Vista PC: Reducimos el margen a la mitad (de 4em a 2em) */
.archive.woocommerce #primary,
.woocommerce-shop #primary {
    margin-top: 2em !important;
}
/* 2. Vista Móvil: Lo reducimos al mínimo indispensable para ganar pantalla */
@media (max-width: 768px) {
    .archive.woocommerce #primary,
    .woocommerce-shop #primary {
        margin-top: 1em !important; /* Si aún lo ves separado, puedes bajar a 0.5em o 10px */
    }
}
/* Zoom con border-radius mantenido */
#imagen-zoom-premium {
    overflow: hidden !important;
    border-radius: 8px !important;        /* ← Importante: al contenedor */
}

#imagen-zoom-premium img {
    transition: transform 0.6s ease-out !important;
    border-radius: 8px !important;        /* ← También en la imagen */
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;         /* Mantiene proporciones y rellena bien */
}

/* Efecto hover */
#imagen-zoom-premium:hover img {
    transform: scale(1.04) !important;
}
/* Solo afecta a la vista móvil dentro de la colección Elemental */
/* ==================== PRODUCTOS FULL WIDTH EN MÓVIL ==================== */
@media (max-width: 767px) {

    #pestanas-elemental .elementor-shortcode .woocommerce ul.products {
        grid-template-columns: 1fr !important;
        display: grid !important;
        gap: 25px !important;
    }

    #pestanas-elemental .elementor-shortcode ul.products li.product {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin: 0 0 30px 0 !important;
        padding: 0 !important;
        float: none !important;
    }

    /* Por si Astra/Elementor fuerza columnas */
    #pestanas-elemental .products.columns-3,
    #pestanas-elemental .products.columns-2,
    #pestanas-elemental .products.columns-4 {
        grid-template-columns: 1fr !important;
    }
}

/* Fondo fijo para el bloque ESSENTIALS - compatible con WPML */
.fondo-essentials-fijo {
    background-image: url('https://www.arguineguinsouvenirs.com/wp-content/uploads/2026/06/best-tshirts-gran-canaria.webp') !important;
    background-size: cover !important;
    background-position: center !important;
}
/* Forzar renderizado temprano de la cabecera + suavizar flash */
.site-header, 
.ast-primary-header {
    visibility: visible !important;
    opacity: 1 !important;
    transition: background-image 0.3s ease !important;
}

/* Opcional: suavizar también contenedores Elementor */
.elementor-section,
.elementor-container,
.e-con {
    transition: background-image 0.3s ease !important;
}