/* ============================================================
   1. CABECERA FIJA Y PEGADA (MÓVIL Y DESKTOP)
   ============================================================ */
header, .wp-custom-header, .site-header {
   
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 99999 !important; /* Asegura que esté por encima de todo */
    background-color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
    margin: 0 !important; /* Elimina márgenes que puedan separarla del borde */
}

/* 2. AJUSTE PARA EL CUERPO DE LA WEB (Para que el contenido no se tape) */
body {
     /* Ajusta este número según la altura de tu menú */
    margin-top: 0 !important;
}

/* Ajuste específico para móviles */
@media screen and (max-width: 600px) {
    body {
         /* Menos espacio en móvil */
    }
}

/* 3. COMPATIBILIDAD CON LA BARRA DE ADMIN DE WORDPRESS */
/* Si estás logueado, baja la cabecera para que la barra negra no la tape */
.admin-bar header, .admin-bar .wp-custom-header {
    top: 32px !important;
}

@media screen and (max-width: 782px) {
    .admin-bar header, .admin-bar .wp-custom-header {
        top: 46px !important;
    }
}

/* ============================================================
   4. LETRAS NEGRAS INTENSAS (MÁXIMA LEGIBILIDAD)
   ============================================================ */
/* Forzamos el color negro puro (#000) y grosor máximo en textos clave */
header span, 
header p, 
header a, 
header div,
.social-bar span,
.welcome-banner p {
    color: #000000 !important;
    font-weight: 800 !important; /* Letra muy negra y gruesa */
    opacity: 1 !important;
    -webkit-font-smoothing: antialiased;
}

/* El menú negro mantiene sus letras blancas para que se lean bien */
nav.main-navigation a, 
header nav a {
    color: #ffffff !important;
    font-weight: 900 !important;
    text-shadow: 0px 0px 1px rgba(255,255,255,0.2);
}

/* Enlaces del menú al pasar el ratón */
nav.main-navigation a:hover {
    color: #ec4899 !important; /* Rosa fuerte al pasar el ratón */
}

/* ============================================================
   5. OPTIMIZACIÓN PARA MÓVIL (SIN SCROLL LATERAL)
   ============================================================ */
html, body {
    overflow-x: hidden; /* Evita que la web se mueva hacia los lados */
    width: 100%;
}

/* Menú deslizable con el dedo en móvil */
.no-scrollbar {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.wpcom-ai-sticky-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
}
/* Cabecera fija - Vella Perfumeria */
.wp-block-post-content > .wp-block-group:first-child,
.wp-block-post-content > div > .wp-block-group:first-child,
.entry-content > .wp-block-group:first-child,
.has-global-padding > .wp-block-group:first-child {
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
}
sticky-header nav a,
.sticky-header .wp-block-navigation a,
header .wp-block-navigation a,
header nav a {
    color: #000000 !important;
}
.wp-block-template-part[class*="header"],
header.wp-block-template-part,
.site-header,
#masthead {
  position: sticky;
  top: 0;
  z-index: 999;
}
No veo el bloque de paginación en la estructura actual de la plantilla. La paginación en WooCommerce es generada dinámicamente, así que lo más efectivo es añadir CSS personalizado para estilizarla.

Lo mejor es hacerlo vía CSS adicional. Añade esto en **Apariencia → Personalizar → CSS adicional**:

```css
/* Paginación WooCommerce */
.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
  background-color: #888888 !important;
  color: #ffffff !important;
  border: 2px solid #ffffff !important;
  border-radius: 4px !important;
  padding: 6px 12px !important;
}

/* Número activo/actual */
.woocommerce-pagination ul li span.current {
  background-color: #555555 !important;
  color: #ffffff !important;
}

/* Hover */
.woocommerce-pagination ul li a:hover {
  background-color: #666666 !important;
  color: #ffffff !important;
}
```

Esto dará a los botones "Anterior", "Siguiente" y los números de página un fondo **gris** con texto **blanco** y borde blanco alrededor del rectángulo.

[Ir a CSS adicional](https://vellaperfumeria.com/wp-admin/customize.php?autofocus[section]=custom_css)
/* =========================================================================
   CABECERA FIJA (STICKY) UNIVERSAL PARA WORDPRESS
   COMPATIBLE CON: TEMAS CLÁSICOS, ELEMENTOR, GUTENBERG, ASTRA, DIVI, ETC.
   ========================================================================= */

/* 1. CORRECCIÓN CRÍTICA PARA CONTENEDORES PADRE
   (Evita que 'overflow: hidden' de los temas anule la posición fija) */
html,
body,
#page,
.site,
.site-content,
.ast-container,
.elementor-inner {
  overflow-x: clip !important;
}

/* 2. REGLA MAESTRA: FIJA LA CABECERA AL HACER SCROLL */
#bp-wp-header-wrapper,
header,
#masthead,
.site-header,
#site-header,
.main-header,
.main-header-bar,
.elementor-location-header,
[data-elementor-type="header"],
header.wp-block-template-part {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  z-index: 99999 !important; /* Prioridad por encima de banners, sliders y contenido */
  background-color: #ffffff !important; /* Evita que el texto de la web se transparente debajo */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important; /* Sombra sutil al desplazarse */
  transition: all 0.25s ease !important;
  transform: none !important;
  contain: none !important;
  overflow: visible !important; /* Impide que los menús desplegables se corten */
  box-sizing: border-box !important;
}

/* 3. COMPENSACIÓN CUANDO ESTÁS DENTRO DE WORDPRESS (BARRA DE ADMIN) */
body.admin-bar #bp-wp-header-wrapper,
body.admin-bar header,
body.admin-bar #masthead,
body.admin-bar .site-header,
body.admin-bar #site-header,
body.admin-bar .main-header,
body.admin-bar .elementor-location-header,
body.admin-bar [data-elementor-type="header"],
body.admin-bar header.wp-block-template-part,
.admin-bar header,
.admin-bar .site-header {
  top: 32px !important; /* Altura de la barra admin en ordenador */
}

@media screen and (max-width: 782px) {
  body.admin-bar #bp-wp-header-wrapper,
  body.admin-bar header,
  body.admin-bar #masthead,
  body.admin-bar .site-header,
  body.admin-bar #site-header,
  body.admin-bar .main-header,
  body.admin-bar .elementor-location-header,
  body.admin-bar [data-elementor-type="header"],
  body.admin-bar header.wp-block-template-part,
  .admin-bar header,
  .admin-bar .site-header {
    top: 46px !important; /* Altura de la barra admin en móviles y tablets */
  }
}

/* 4. PREVIENE SALTOS O HUECOS CON EL CONTENIDO SIGUIENTE */
#bp-wp-header-wrapper + *,
header + *,
.site-header + *,
#masthead + * {
  margin-top: 0 !important;
}

/* 5. ASEGURA QUE LOS MENÚS DESPLEGABLES SE VEAN SIEMPRE COMPLETOS */
header nav,
.site-header nav,
header .sub-menu,
.site-header .sub-menu,
header .dropdown-menu,
.site-header .dropdown-menu,
header [class*="dropdown"],
.site-header [class*="dropdown"],
header [class*="menu"],
.site-header [class*="menu"] {
  overflow: visible !important;
  z-index: 999999 !important;
}/* =========================================================================
   CABECERA FIJA ARRIBA AL HACER SCROLL EN WORDPRESS (STICKY HEADER)
   Compatible con Elementor, temas clásicos, bloques Gutenberg, Astra, etc.
   ========================================================================= */

/* 1. Soluciona el problema de los temas que anulan el fijado */
html,
body,
#page,
.site,
.site-content,
.ast-container,
.elementor-inner {
  overflow-x: clip !important;
}

/* 2. Deja la cabecera fija arriba al deslizar la página */
header,
#masthead,
.site-header,
#site-header,
.main-header,
.main-header-bar,
.elementor-location-header,
[data-elementor-type="header"],
#bp-wp-header-wrapper,
header.wp-block-template-part {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  z-index: 99999 !important; /* Pasa por encima de sliders, banners y fotos */
  background-color: #ffffff !important; /* Fondo opaco para que no se transparente el texto */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important; /* Sombra sutil al flotar */
  box-sizing: border-box !important;
  overflow: visible !important; /* Evita que se corten los menús desplegables */
}

/* 3. Ajuste cuando tienes la barra negra de administrador de WordPress activa */
body.admin-bar header,
body.admin-bar #masthead,
body.admin-bar .site-header,
body.admin-bar #site-header,
body.admin-bar .main-header,
body.admin-bar .elementor-location-header,
body.admin-bar [data-elementor-type="header"],
body.admin-bar #bp-wp-header-wrapper {
  top: 32px !important; /* Espacio para la barra de admin en ordenador */
}

@media screen and (max-width: 782px) {
  body.admin-bar header,
  body.admin-bar #masthead,
  body.admin-bar .site-header,
  body.admin-bar #site-header,
  body.admin-bar .main-header,
  body.admin-bar .elementor-location-header,
  body.admin-bar [data-elementor-type="header"],
  body.admin-bar #bp-wp-header-wrapper {
    top: 46px !important; /* Espacio para la barra de admin en móvil */
  }
}

/* 4. Evita que los submenús o menús desplegables se queden ocultos */
header nav,
.site-header nav,
header .sub-menu,
.site-header .sub-menu,
header .dropdown-menu,
.site-header .dropdown-menu {
  overflow: visible !important;
  z-index: 999999 !important;
}
/* =========================================================================
   CABECERA FIJA ARRIBA AL HACER SCROLL EN WORDPRESS (STICKY HEADER)
   Compatible con Elementor, temas clásicos, bloques Gutenberg, Astra, etc.
   ========================================================================= */

/* 1. Soluciona el problema de los temas que anulan el fijado */
html,
body,
#page,
.site,
.site-content,
.ast-container,
.elementor-inner {
  overflow-x: clip !important;
}

/* 2. Deja la cabecera fija arriba al deslizar la página */
header,
#masthead,
.site-header,
#site-header,
.main-header,
.main-header-bar,
.elementor-location-header,
[data-elementor-type="header"],
#bp-wp-header-wrapper,
header.wp-block-template-part {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  z-index: 99999 !important; /* Pasa por encima de sliders, banners y fotos */
  background-color: #ffffff !important; /* Fondo opaco para que no se transparente el texto */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important; /* Sombra sutil al flotar */
  box-sizing: border-box !important;
  overflow: visible !important; /* Evita que se corten los menús desplegables */
}

/* 3. Ajuste cuando tienes la barra negra de administrador de WordPress activa */
body.admin-bar header,
body.admin-bar #masthead,
body.admin-bar .site-header,
body.admin-bar #site-header,
body.admin-bar .main-header,
body.admin-bar .elementor-location-header,
body.admin-bar [data-elementor-type="header"],
body.admin-bar #bp-wp-header-wrapper {
  top: 32px !important; /* Espacio para la barra de admin en ordenador */
}

@media screen and (max-width: 782px) {
  body.admin-bar header,
  body.admin-bar #masthead,
  body.admin-bar .site-header,
  body.admin-bar #site-header,
  body.admin-bar .main-header,
  body.admin-bar .elementor-location-header,
  body.admin-bar [data-elementor-type="header"],
  body.admin-bar #bp-wp-header-wrapper {
    top: 46px !important; /* Espacio para la barra de admin en móvil */
  }
}

/* 4. Evita que los submenús o menús desplegables se queden ocultos */
header nav,
.site-header nav,
header .sub-menu,
.site-header .sub-menu,
header .dropdown-menu,
.site-header .dropdown-menu {
  overflow: visible !important;
  z-index: 999999 !important;
}/* ==========================================================================
   CSS ADICIONAL PARA VELLAPERFUMERIA.COM
   OBJETIVO:
   1. SOLO la cabecera principal se queda fija arriba (Sticky).
   2. La sección "Todo lo que necesitas para brillar" y el resto de la tienda
      ruedan libremente y NO se bloquean ni se quedan fijas en pantalla.
   ========================================================================== */

/* 1. SOLO LA CABECERA QUEDA FIJA ARRIBA */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.vella-header-main,
.header-wrapper,
div[data-elementor-type="header"] {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 99999 !important; /* Siempre por encima del contenido */
  background-color: #ffffff !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.07) !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
}

/* Compensación de altura para usuarios administradores conectados a WordPress */
body.admin-bar header,
body.admin-bar .site-header,
body.admin-bar #masthead,
body.admin-bar .elementor-location-header,
body.admin-bar div[data-elementor-type="header"] {
  top: 32px !important;
}

@media screen and (max-width: 782px) {
  body.admin-bar header,
  body.admin-bar .site-header,
  body.admin-bar #masthead,
  body.admin-bar .elementor-location-header,
  body.admin-bar div[data-elementor-type="header"] {
    top: 46px !important;
  }
}

/* 2. DESBLOQUEO TOTAL: SECCIÓN "TODO LO QUE NECESITAS PARA BRILLAR" Y BANNER HERO
   (Elimina cualquier 'sticky' o 'fixed' accidental fuera de la cabecera) */

/* Desactiva efectos de fijado de Elementor fuera de la cabecera */
.elementor-sticky:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *),
.elementor-sticky--active:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *),
.elementor-sticky--top:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *) {
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  z-index: 1 !important;
}

/* Libera la sección hero/portada "Todo lo que necesitas para brillar" */
section:not(header):not(.site-header),
.elementor-section:not(header *):not(.site-header *):not(.elementor-location-header *),
.elementor-top-section:not(header *):not(.site-header *),
.wp-block-cover:not(header *),
.hero-section,
.banner-section,
[class*="brillar"],
[id*="brillar"],
[data-id*="brillar"],
[class*="hero"],
[class*="banner"] {
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  max-height: none !important;
  z-index: 10 !important; /* Por debajo de la cabecera (z-index 99999) */
  pointer-events: auto !important; /* Permite hacer clic y navegar */
}

/* Desactiva bloqueos de clic producidos por fondos decorativos o capas transparentes */
.elementor-background-overlay,
.wp-block-cover__background {
  pointer-events: none !important;
}

/* 3. LIBERACIÓN DEL SCROLL VERTICAL (SIN BLOQUEOS NI CONGELAMIENTOS) */
html,
body,
#page,
.site,
.site-content,
#content,
main,
#main {
  overflow-x: hidden !important;
  overflow-y: auto !important; /* Scroll vertical 100% activo y fluido */
  height: auto !important;
  min-height: 100% !important;
  max-height: none !important;
}

/* Evita que el contenido quede tapado detrás de la cabecera */
#content,
main,
.site-content,
.entry-content {
  position: relative !important;
  z-index: 1 !important;
}/* ==========================================================================
   CSS ADICIONAL UNIVERSAL PARA VELLAPERFUMERIA.COM
   --------------------------------------------------------------------------
   APUNTE:
   1. CABECERAS FIJAS EN TODAS LAS PÁGINAS:
      Fija la cabecera en Inicio, Tienda, Fichas de Producto, Categorías,
      Catálogos, Blog, Carrito y Checkout de WooCommerce.
      Cubre Astra, OceanWP, Storefront, GeneratePress y Elementor Header Builder.
      
   2. NINGÚN OTRO CONTENIDO BLOQUEADO:
      La sección "Todo lo que necesitas para brillar", sliders, banners hero,
      fondos y columnas fluyen y ruedan libremente con el scroll natural.
   ========================================================================== */

/* 1. PERMITIR QUE 'STICKY' FUNCIONE EN TODAS LAS PLANTILLAS DE WORDPRESS */
html,
body,
#page,
.site,
.site-content,
.ast-container {
  overflow-x: clip !important; /* Evita que el contenedor anule el fijado de la cabecera */
  overflow-y: visible !important;
}

/* 2. CABECERA FIJA ARRIBA EN TODAS LAS PÁGINAS DEL SITIO */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.vella-header-main,
.header-wrapper,
.ast-main-header-wrap,
.ast-primary-header-bar,
.main-header-bar,
.oceanwp-header,
.storefront-primary-navigation,
div[data-elementor-type="header"],
div[data-elementor-type="header"] > .elementor-section,
div[data-elementor-type="header"] > .e-con,
.site-header.ast-mobile-header,
.ast-mobile-header-wrap {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 99999 !important; /* Siempre arriba del todo, visible sobre cualquier sección */
  background-color: #ffffff !important;
  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease-in-out !important;
  box-sizing: border-box !important;
}

/* Compensación de altura si el administrador está logueado en WordPress */
body.admin-bar header,
body.admin-bar .site-header,
body.admin-bar #masthead,
body.admin-bar .elementor-location-header,
body.admin-bar div[data-elementor-type="header"],
body.admin-bar .ast-primary-header-bar {
  top: 32px !important;
}

@media screen and (max-width: 782px) {
  body.admin-bar header,
  body.admin-bar .site-header,
  body.admin-bar #masthead,
  body.admin-bar .elementor-location-header,
  body.admin-bar div[data-elementor-type="header"],
  body.admin-bar .ast-primary-header-bar {
    top: 46px !important;
  }
}

/* 3. LIBERACIÓN TOTAL: SECCIÓN "TODO LO QUE NECESITAS PARA BRILLAR" Y BANNER HERO
   (Garantiza que ruede suavemente con el scroll y NUNCA se quede fija ni congelada) */
.elementor-sticky:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *),
.elementor-sticky--active:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *),
.elementor-sticky--top:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *) {
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  z-index: 1 !important;
}

/* La sección "Todo lo que necesitas para brillar" y cualquier sección hero/banner */
section:not(header):not(.site-header):not(.elementor-location-header):not(div[data-elementor-type="header"]),
.elementor-section:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *),
.elementor-top-section:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *),
.e-con:not(header *):not(.site-header *):not(.elementor-location-header *):not(div[data-elementor-type="header"] *),
.wp-block-cover:not(header *),
.hero-section,
.banner-section,
[class*="brillar"],
[id*="brillar"],
[data-id*="brillar"],
[class*="hero"],
[class*="banner"] {
  position: relative !important; /* Flujo normal: se desplaza con el scroll sin fijarse */
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  max-height: none !important;
  z-index: 10 !important; /* Por debajo de la cabecera (z-index 99999) */
  pointer-events: auto !important; /* Permite hacer clic libremente */
}

/* Desactivar bloqueos de clics en overlays decorativos */
.elementor-background-overlay,
.wp-block-cover__background {
  pointer-events: none !important;
}

/* 4. SCROLL FLUIDO Y NATURAL EN TODO EL CUERPO DE LA TIENDA */
#content,
main,
#main,
.site-content,
.entry-content,
.woocommerce,
.woocommerce-page {
  position: relative !important;
  z-index: 1 !important;
  pointer-events: auto !important;
}/* ==========================================================================
   VELLAPERFUMERIA.COM - CALIBRACIÓN EXACTA DE PRODUCTOS Y ENUNCIADOS EN MINÚSCULA
   ========================================================================== */

/* 1. REJILLA DE TIENDA: 2 PRODUCTOS POR FILA NIVELADOS */
.woocommerce ul.products,
.woocommerce-page ul.products,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 2. TARJETA DE CADA PRODUCTO: IDÉNTICA ALTURA Y ANCHO */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product {
  width: 100% !important;
  margin-right: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 16px !important;
  background-color: #ffffff !important;
  border-radius: 18px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.woocommerce ul.products li.product:hover,
.wc-block-grid__product:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
}

/* 3. ENLACE INTERNO (FLEX GROW PARA CENTRAR ELEMENTOS) */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce-loop-product__link,
.wc-block-grid__product-link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  flex-grow: 1 !important;
  width: 100% !important;
  text-decoration: none !important;
}

/* 4. IMÁGENES CALIBRADAS A LA MISMA ALTURA EXACTA */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img {
  height: 220px !important;
  max-height: 220px !important;
  width: 100% !important;
  object-fit: contain !important;
  margin: 0 auto 12px auto !important;
  display: block !important;
  transition: transform 0.3s ease !important;
}

@media screen and (max-width: 640px) {
  .woocommerce ul.products li.product img,
  .woocommerce-loop-product__link img,
  .wc-block-grid__product-image img {
    height: 170px !important;
    max-height: 170px !important;
  }
}

/* 5. ENUNCIADOS (TÍTULOS) EN LETRA MINÚSCULA Y ALTURA EXACTA */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
  text-transform: lowercase !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  color: #1c1917 !important;
  text-align: center !important;
  min-height: 40px !important;
  max-height: 40px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 4px 0 8px 0 !important;
  padding: 0 !important;
}

/* 6. ZONA DE PRECIO CALIBRADA Y CENTRADA */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 12px 0 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

/* 7. TODOS LOS BOTONES A LA MISMA ALTURA Y ANCHO, ALINEADOS AL FONDO */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  margin-top: auto !important; /* Alinea los botones exactamente al mismo nivel horizontal */
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 16px !important;
  border-radius: 9999px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  background-color: #1c1917 !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(194, 24, 91, 0.25) !important;
}/* ==========================================================================
   VELLAPERFUMERIA.COM - ANCHO COMPLETO, MÁRGENES ESTRECHOS Y CONTROL DE ZOOM
   ========================================================================== */

/* 1. CONTROL DE ZOOM, ESCALADO Y DESBORDES */
html {
  -webkit-text-size-adjust: 100% !important; /* Evita que el navegador infle el texto */
  text-size-adjust: 100% !important;
  -ms-text-size-adjust: 100% !important;
  touch-action: manipulation !important;     /* Evita zoom accidental por doble tap */
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  touch-action: manipulation !important;
  box-sizing: border-box !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* 2. ELIMINAR MÁRGENES LATERALES EXCESIVOS (EVITA COLUMNAS ESTRECHAS EN MÓVIL Y ESCRITORIO) */
#page,
.site,
.site-content,
.content-area,
main,
#main,
.site-main,
.entry-content,
.wp-site-blocks,
.ast-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-section,
.wp-block-group,
.hentry {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 6px !important;  /* Margen mínimo para aprovechar todo el ancho */
  padding-right: 6px !important; /* Margen mínimo para aprovechar todo el ancho */
  box-sizing: border-box !important;
}

@media screen and (min-width: 769px) {
  #page,
  .site-content,
  .ast-container,
  .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

/* 3. BLOQUES HTML PERSONALIZADOS Y CÓDIGOS COPIADOS EN WORDPRESS */
.wp-block-html,
.custom-html-widget,
.widget_custom_html,
.elementor-widget-html,
.elementor-widget-text-editor,
.vella-custom-block,
.vp-container,
.vp-grid,
.vella-store-grid {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
  box-sizing: border-box !important;
}

/* Evita que imágenes rompan el ancho y fuercen scroll o zoom lateral */
img, video, iframe {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box !important;
}

/* 4. REJILLA DE TIENDA: 2 PRODUCTOS POR FILA CON ANCHO COMPLETO */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products,
ul.products.columns-2,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

@media screen and (min-width: 768px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .products,
  .wc-block-grid__products {
    gap: 14px !important;
  }
}

/* 5. TARJETA DE PRODUCTO: MISMA ALTURA Y ANCHO */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product,
.woocommerce .products .product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  background-color: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03) !important;
}

/* Enlace interno */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce-loop-product__link,
.wc-block-grid__product-link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  flex-grow: 1 !important;
  width: 100% !important;
  text-decoration: none !important;
}

/* Imagen del producto uniforme */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img,
.woocommerce ul.products li.product a img {
  height: 200px !important;
  max-height: 200px !important;
  min-height: 200px !important;
  width: 100% !important;
  object-fit: contain !important;
  margin: 0 auto 10px auto !important;
  display: block !important;
}

@media screen and (max-width: 640px) {
  .woocommerce ul.products li.product img,
  .woocommerce-loop-product__link img,
  .wc-block-grid__product-image img {
    height: 155px !important;
    max-height: 155px !important;
    min-height: 155px !important;
  }
}

/* 6. ENUNCIADOS EN LETRA MINÚSCULA Y ALTURA CALIBRADA */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.ast-loop-product__title {
  text-transform: lowercase !important; /* ENUNCIADOS EN MINÚSCULA */
  font-variant: normal !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 4px 0 6px 0 !important;
  padding: 0 !important;
  word-wrap: break-word !important;
  word-break: normal !important;
  hyphens: none !important;
}

/* 7. PRECIO Y BOTONES ALINEADOS AL FONDO */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 10px 0 !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button,
.add_to_cart_button {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin-top: auto !important; /* Alinea todos los botones a la misma altura inferior */
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important; /* BOTÓN EN MINÚSCULA */
  letter-spacing: 0.02em !important;
  text-align: center !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.add_to_cart_button:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}/* ==========================================================================
   ESTRUCTURA COMPLETA DE FRANJAS ENCIMA DE LA FOTO DEL HÉROE
   (Franja Rosa + Franja Logo Blanca + Franja Menú Negro)
   ========================================================================== */

/* 1. Contenedor Maestro Adhesivo */
#bp-wp-header-wrapper,
header,
.site-header {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 99999 !important;
  background-color: #ffffff !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.08) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 2. Franja Superior Rosa (24px) */
.bp-topbar {
  background-color: #ea9ec3 !important;
  color: #ffffff !important;
  height: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 3. Franja Central Blanca con Logo (48px - 54px) */
.bp-brand-bar {
  background-color: #ffffff !important;
  height: 50px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 4. Franja Inferior Negra con Menú (36px) */
.bp-navbar {
  background-color: #000000 !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 5. Conexión perfecta con la foto del héroe inferior (cero separación blanca) */
.hero-section,
.banner-section,
.vella-hero-slider,
[class*="hero"],
[id*="hero"] {
  margin-top: 0 !important;
  padding-top: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}/* ==========================================================================
   FRANJA SUPERIOR ROSA (BARRA DE ANUNCIO Y REDES SOCIALES)
   Color Rosa Orquídea Clarita (#ea9ec3) ultra-fina (24px - 28px)
   ========================================================================== */
.bp-topbar,
.vella-promo-bar,
.vella-top-bar,
.announcement-bar,
.wp-block-group.vella-top-line {
  background-color: #ea9ec3 !important; /* Rosa orquídea clarita */
  color: #ffffff !important;
  width: 100% !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04) !important;
  box-sizing: border-box !important;
}

/* Texto de la franja de anuncio */
.bp-topbar-text,
.vella-top-bar span {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: 0.3px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* Círculos negros con iconos blancos para WhatsApp y Redes */
.bp-social-circle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background-color: #000000 !important; /* Círculo negro */
  color: #ffffff !important;
  text-decoration: none !important;
  margin-left: 5px !important;
}/* ==========================================================================
   VELLAPERFUMERIA.COM - BLOQUEO Y CONTROL ESTRICTO DE ZOOM Y TAMAÑO DE LETRA
   Evita que el aumento de letra rompa la estructura, desborde cajas o cree
   columnas verticales no deseadas.
   ========================================================================== */

/* 1. BLOQUEO DE INFLACIÓN AUTOMÁTICA DEL TEXTO (TEXT AUTOSIZING EN MÓVILES) */
html {
  -webkit-text-size-adjust: 100% !important; /* Desactiva que Safari/Chrome agranden la letra por su cuenta */
  text-size-adjust: 100% !important;
  -moz-text-size-adjust: 100% !important;
  -ms-text-size-adjust: 100% !important;
  touch-action: manipulation !important;     /* Bloquea zoom accidental por doble pulsación */
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  touch-action: manipulation !important;
  -webkit-font-smoothing: antialiased !important;
  box-sizing: border-box !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* 2. TOPE MÁXIMO DE CRECIMIENTO DE LETRA (CLAMP CON TAMAÑO MÁXIMO CONTROLADO)
   Aunque el usuario o el navegador aumente la fuente, nunca superará este límite */
body, 
p, 
span, 
li, 
a, 
input, 
textarea, 
button {
  max-height: 999999px; /* Truco estándar de WebKit para anular inflación de fuentes */
}

/* Párrafos y textos generales: tamaño fijado con variación mínima */
p, .entry-content p, .site-content p {
  font-size: clamp(13px, 1.2vw, 15px) !important;
  line-height: 1.45 !important;
}

/* Encabezados bloqueados para que no desborden */
h1, .h1 { font-size: clamp(20px, 3.5vw, 26px) !important; line-height: 1.2 !important; }
h2, .h2 { font-size: clamp(17px, 2.8vw, 21px) !important; line-height: 1.25 !important; }
h3, .h3 { font-size: clamp(14px, 2.2vw, 17px) !important; line-height: 1.3 !important; }

/* 3. BLOQUEO DE LA CABECERA Y MENÚS (NUNCA CRECEN NI SE DESCUADRAN) */
header,
.site-header,
#masthead,
.vella-header-main,
.bp-navbar,
#site-navigation {
  max-height: 140px !important;
}

/* Enlaces del menú en una sola línea fija (impide que salten a dos líneas) */
.site-navigation a,
.main-navigation a,
.bp-navbar a,
.nav-menu-container a,
ul.menu li a {
  font-size: clamp(10px, 1vw, 11.5px) !important; /* Límite milimétrico */
  white-space: nowrap !important;                  /* Prohibido partirse en 2 líneas */
  line-height: 1 !important;
  padding: 8px 10px !important;
}

/* Franja superior de anuncio rosa */
.bp-topbar, .vella-promo-bar, .announcement-bar {
  height: 24px !important;
  max-height: 26px !important;
  overflow: hidden !important;
}
.bp-topbar-text, .vella-top-bar span {
  font-size: clamp(9.5px, 0.9vw, 11px) !important;
  white-space: nowrap !important;
}

/* 4. BLOQUEO EN TARJETAS DE PRODUCTOS DE LA TIENDA */
/* El título del producto nunca pasará de 2 líneas ni crecerá desproporcionado */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.product h2,
.product h3 {
  font-size: clamp(12.5px, 1.3vw, 14px) !important;
  line-height: 1.3 !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  word-break: normal !important;
}

/* Los botones nunca engordan ni se descuadran */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.add_to_cart_button,
.vella-add-to-cart-btn {
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  font-size: clamp(11.5px, 1.1vw, 13px) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  padding: 0 12px !important;
}

/* 5. PROTECCIÓN DE REJILLA Y CONTENEDORES CONTRA DESBORDAMIENTO */
.woocommerce ul.products,
.wc-block-grid__products,
.products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Imágenes fijadas para que ningún aumento las deforme */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img {
  height: clamp(140px, 20vw, 210px) !important;
  max-height: 210px !important;
  object-fit: contain !important;
  width: 100% !important;
}

/* Contenedor general anti-scroll horizontal */
#page, .site, .site-content, main, #main {
  max-width: 100% !important;
  overflow-x: hidden !important;
}
/* ==========================================================================
   VELLAPERFUMERIA.COM - CSS DEFINITIVO PARA WORDPRESS / WOOCOMMERCE
   ========================================================================== */

/* 1. CONTROL DE ZOOM, ESCALADO Y ANCHO COMPLETO */
html {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
  -ms-text-size-adjust: 100% !important;
  touch-action: manipulation !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body {
  overflow-x: clip !important;
  overflow-y: visible !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  touch-action: manipulation !important;
  box-sizing: border-box !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* 2. ELIMINAR MÁRGENES LATERALES (EVITA COLUMNAS ESTRECHAS EN MÓVIL Y ESCRITORIO) */
#page,
.site,
.site-content,
.content-area,
main,
#main,
.site-main,
.entry-content,
.wp-site-blocks,
.ast-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-section,
.wp-block-group,
.hentry,
.wp-block-html,
.custom-html-widget {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
  box-sizing: border-box !important;
}

@media screen and (min-width: 769px) {
  #page,
  .site-content,
  .ast-container,
  .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

img, video, iframe {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box !important;
}

/* 3. CABECERA FIJA SUPERIOR ('STICKY') */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.ast-main-header-wrap,
.ast-primary-header-bar,
.main-header-bar,
.site-header.ast-mobile-header,
.ast-mobile-header-wrap {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 99999 !important;
  background-color: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06) !important;
}

/* 4. TIENDA: 2 PRODUCTOS POR FILA CON ANCHO COMPLETO */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products,
ul.products.columns-2,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

@media screen and (min-width: 768px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .products,
  .wc-block-grid__products {
    gap: 14px !important;
  }
}

/* 5. TARJETAS DE PRODUCTO: MISMA ALTURA, MISMO ANCHO Y SIMETRÍA */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product,
.woocommerce .products .product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  background-color: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.woocommerce ul.products li.product:hover,
.wc-block-grid__product:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06) !important;
}

/* Enlace del producto */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce-loop-product__link,
.wc-block-grid__product-link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  flex-grow: 1 !important;
  width: 100% !important;
  text-decoration: none !important;
}

/* Fotos con altura fija uniforme para evitar descuadres */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img,
.woocommerce ul.products li.product a img {
  height: 200px !important;
  max-height: 200px !important;
  min-height: 200px !important;
  width: 100% !important;
  object-fit: contain !important;
  margin: 0 auto 10px auto !important;
  display: block !important;
}

@media screen and (max-width: 640px) {
  .woocommerce ul.products li.product img,
  .woocommerce-loop-product__link img,
  .wc-block-grid__product-image img,
  .woocommerce ul.products li.product a img {
    height: 155px !important;
    max-height: 155px !important;
    min-height: 155px !important;
  }
}

/* 6. ENUNCIADOS (TÍTULOS) EN MINÚSCULA Y ALTURA UNIFORME */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.ast-loop-product__title {
  text-transform: lowercase !important; /* ENUNCIADOS EN MINÚSCULA */
  font-variant: normal !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 4px 0 6px 0 !important;
  padding: 0 !important;
  word-wrap: break-word !important;
  word-break: normal !important;
  hyphens: none !important;
}

/* 7. PRECIO Y BOTONES ALINEADOS AL FONDO */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 10px 0 !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button,
.add_to_cart_button {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin-top: auto !important; /* ALINEA TODOS LOS BOTONES A LA MISMA ALTURA */
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important; /* TEXTO DEL BOTÓN EN MINÚSCULA */
  letter-spacing: 0.02em !important;
  text-align: center !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.add_to_cart_button:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* 8. FOOTER APILADO VERTICALMENTE EN MÓVILES */
@media screen and (max-width: 768px) {
  footer,
  .site-footer,
  .footer-widgets,
  .site-below-footer-wrap,
  .ast-footer,
  #colophon,
  footer .footer-grid-container,
  footer .grid {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    text-align: center !important;
    gap: 24px !important;
  }

  footer .widget,
  .site-footer .widget,
  footer > div,
  .footer-widgets > div {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  footer ul,
  .site-footer ul {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }
}/* ==========================================================================
   VELLAPERFUMERIA.COM - CSS DEFINITIVO PARA WORDPRESS / WOOCOMMERCE
   ========================================================================== */

/* 1. CONTROL DE ZOOM, ESCALADO Y ANCHO COMPLETO */
html {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
  -ms-text-size-adjust: 100% !important;
  touch-action: manipulation !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body {
  overflow-x: clip !important;
  overflow-y: visible !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  touch-action: manipulation !important;
  box-sizing: border-box !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* 2. ELIMINAR MÁRGENES LATERALES (EVITA COLUMNAS ESTRECHAS EN MÓVIL Y ESCRITORIO) */
#page,
.site,
.site-content,
.content-area,
main,
#main,
.site-main,
.entry-content,
.wp-site-blocks,
.ast-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-section,
.wp-block-group,
.hentry,
.wp-block-html,
.custom-html-widget {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
  box-sizing: border-box !important;
}

@media screen and (min-width: 769px) {
  #page,
  .site-content,
  .ast-container,
  .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

img, video, iframe {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box !important;
}

/* 3. CABECERA FIJA SUPERIOR ('STICKY') */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.ast-main-header-wrap,
.ast-primary-header-bar,
.main-header-bar,
.site-header.ast-mobile-header,
.ast-mobile-header-wrap {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 99999 !important;
  background-color: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06) !important;
}

/* 4. TIENDA: 2 PRODUCTOS POR FILA CON ANCHO COMPLETO */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products,
ul.products.columns-2,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

@media screen and (min-width: 768px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .products,
  .wc-block-grid__products {
    gap: 14px !important;
  }
}

/* 5. TARJETAS DE PRODUCTO: MISMA ALTURA, MISMO ANCHO Y SIMETRÍA */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product,
.woocommerce .products .product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  background-color: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.woocommerce ul.products li.product:hover,
.wc-block-grid__product:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06) !important;
}

/* Enlace del producto */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce-loop-product__link,
.wc-block-grid__product-link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  flex-grow: 1 !important;
  width: 100% !important;
  text-decoration: none !important;
}

/* Fotos con altura fija uniforme para evitar descuadres */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img,
.woocommerce ul.products li.product a img {
  height: 200px !important;
  max-height: 200px !important;
  min-height: 200px !important;
  width: 100% !important;
  object-fit: contain !important;
  margin: 0 auto 10px auto !important;
  display: block !important;
}

@media screen and (max-width: 640px) {
  .woocommerce ul.products li.product img,
  .woocommerce-loop-product__link img,
  .wc-block-grid__product-image img,
  .woocommerce ul.products li.product a img {
    height: 155px !important;
    max-height: 155px !important;
    min-height: 155px !important;
  }
}

/* 6. ENUNCIADOS (TÍTULOS) EN MINÚSCULA Y ALTURA UNIFORME */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.ast-loop-product__title {
  text-transform: lowercase !important; /* ENUNCIADOS EN MINÚSCULA */
  font-variant: normal !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 4px 0 6px 0 !important;
  padding: 0 !important;
  word-wrap: break-word !important;
  word-break: normal !important;
  hyphens: none !important;
}

/* 7. PRECIO Y BOTONES ALINEADOS AL FONDO */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 10px 0 !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button,
.add_to_cart_button {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin-top: auto !important; /* ALINEA TODOS LOS BOTONES A LA MISMA ALTURA */
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important; /* TEXTO DEL BOTÓN EN MINÚSCULA */
  letter-spacing: 0.02em !important;
  text-align: center !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.add_to_cart_button:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* 8. FOOTER APILADO VERTICALMENTE EN MÓVILES */
@media screen and (max-width: 768px) {
  footer,
  .site-footer,
  .footer-widgets,
  .site-below-footer-wrap,
  .ast-footer,
  #colophon,
  footer .footer-grid-container,
  footer .grid {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    text-align: center !important;
    gap: 24px !important;
  }

  footer .widget,
  .site-footer .widget,
  footer > div,
  .footer-widgets > div {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  footer ul,
  .site-footer ul {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }
}
/* ==========================================================================
   VELLAPERFUMERIA.COM - BLOQUEO DE AUMENTO DE TEXTO EXTERNO Y ZOOM DESCONTROLADO
   --------------------------------------------------------------------------
   - Bloquea cualquier aumento automático o externo del navegador.
   - Todo el control de texto queda delegado exclusivamente al plugin de accesibilidad.
   - Ancho completo, 2 productos por fila, títulos en minúscula y botones alineados.
   ========================================================================== */

/* 1. BLOQUEO TOTAL DE INFLACIÓN Y AUMENTO EXTERNO DE TEXTO EN EL NAVEGADOR */
html,
body,
#page,
.site,
.site-content,
main,
article,
section,
div,
p,
span,
h1, h2, h3, h4, h5, h6,
a,
button,
input,
select,
textarea {
  -webkit-text-size-adjust: 100% !important; /* Prohíbe que navegadores inflen textos */
  -moz-text-size-adjust: 100% !important;
  -ms-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

html {
  touch-action: manipulation !important;     /* Evita zoom accidental por doble toque */
  overflow-x: clip !important;
  overflow-y: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body {
  overflow-x: clip !important;
  overflow-y: visible !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  touch-action: manipulation !important;
  box-sizing: border-box !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* 2. ANCHO COMPLETO SIN MÁRGENES VACÍOS (EVITA COLUMNAS ENCOGIDAS EN MÓVIL) */
#page,
.site,
.site-content,
.content-area,
main,
#main,
.site-main,
.entry-content,
.wp-site-blocks,
.ast-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-section,
.wp-block-group,
.hentry,
.wp-block-html,
.custom-html-widget {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 6px !important;  /* Margen mínimo para no desperdiciar pantalla */
  padding-right: 6px !important;
  box-sizing: border-box !important;
}

@media screen and (min-width: 769px) {
  #page,
  .site-content,
  .ast-container,
  .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

img, video, iframe {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box !important;
}

/* 3. CABECERA FIJA SUPERIOR ('STICKY') */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.ast-main-header-wrap,
.ast-primary-header-bar,
.main-header-bar,
.site-header.ast-mobile-header,
.ast-mobile-header-wrap {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 99999 !important;
  background-color: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06) !important;
}

/* 4. TIENDA: 2 PRODUCTOS POR FILA CON ANCHO COMPLETO */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products,
ul.products.columns-2,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

@media screen and (min-width: 768px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .products,
  .wc-block-grid__products {
    gap: 14px !important;
  }
}

/* 5. TARJETAS DE PRODUCTO: MISMA ALTURA Y ANCHO CALIBRADO */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product,
.woocommerce .products .product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  background-color: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.woocommerce ul.products li.product:hover,
.wc-block-grid__product:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06) !important;
}

/* Enlace interno */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce-loop-product__link,
.wc-block-grid__product-link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  flex-grow: 1 !important;
  width: 100% !important;
  text-decoration: none !important;
}

/* Fotos de productos con altura fija uniforme */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img,
.woocommerce ul.products li.product a img {
  height: 200px !important;
  max-height: 200px !important;
  min-height: 200px !important;
  width: 100% !important;
  object-fit: contain !important;
  margin: 0 auto 10px auto !important;
  display: block !important;
}

@media screen and (max-width: 640px) {
  .woocommerce ul.products li.product img,
  .woocommerce-loop-product__link img,
  .wc-block-grid__product-image img,
  .woocommerce ul.products li.product a img {
    height: 155px !important;
    max-height: 155px !important;
    min-height: 155px !important;
  }
}

/* 6. ENUNCIADOS (TÍTULOS) EN LETRA MINÚSCULA Y ALTURA UNIFORME DE 2 LÍNEAS */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.ast-loop-product__title {
  text-transform: lowercase !important; /* ENUNCIADOS EN MINÚSCULA */
  font-variant: normal !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 4px 0 6px 0 !important;
  padding: 0 !important;
  word-wrap: break-word !important;
  word-break: normal !important;
  hyphens: none !important;
}

/* 7. PRECIO Y BOTONES ALINEADOS AL FONDO */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 10px 0 !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button,
.add_to_cart_button {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin-top: auto !important; /* ALINEA TODOS LOS BOTONES A LA MISMA ALTURA */
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important; /* TEXTO DEL BOTÓN EN MINÚSCULA */
  letter-spacing: 0.02em !important;
  text-align: center !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.add_to_cart_button:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* 8. FOOTER APILADO VERTICALMENTE EN MÓVILES */
@media screen and (max-width: 768px) {
  footer,
  .site-footer,
  .footer-widgets,
  .site-below-footer-wrap,
  .ast-footer,
  #colophon,
  footer .footer-grid-container,
  footer .grid {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    text-align: center !important;
    gap: 24px !important;
  }

  footer .widget,
  .site-footer .widget,
  footer > div,
  .footer-widgets > div {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  footer ul,
  .site-footer ul {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }
}
/* ==========================================================================
   VELLAPERFUMERIA.COM - BLINDAJE CONTRA EL NIVELADOR DE ZOOM DE EDGE Y MÓVILES
   ========================================================================== */

/* 1. ANULACIÓN DE AUTO-INFLACIÓN DE TEXTO */
html, body {
  -webkit-text-size-adjust: 100% !important;
  -moz-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* 2. MÁRGENES MÍNIMOS (0 a 3px): ABSORBE EL AUMENTO DEL NIVELADOR SIN ENCOGERSE */
#page,
.site,
.site-content,
.content-area,
main,
#main,
.site-main,
.entry-content,
.wp-site-blocks,
.ast-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.elementor-section,
.elementor-section.elementor-section-boxed > .elementor-container,
.wp-block-group,
.wp-block-html,
.custom-html-widget {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 3px !important;  /* Margen ultra reducido */
  padding-right: 3px !important;
  box-sizing: border-box !important;
}

/* 3. REJILLA INDESTRUCTIBLE A 2 PRODUCTOS (INCLUSO A 200% O 250% DE ZOOM) */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products,
ul.products.columns-2,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  /* minmax(0, 1fr) garantiza que nunca se desborde ni salte a 1 sola columna */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 6px !important; /* Espacio compacto para soportar el zoom de Edge */
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

/* 4. TARJETA DE PRODUCTO BLINDADA */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product,
.woocommerce .products .product {
  width: 100% !important;
  min-width: 0 !important; /* Evita que el contenido interior fuerce el ancho */
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 8px !important; /* Acolchado fino para no robar espacio útil */
  background-color: #ffffff !important;
  border-radius: 12px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
  overflow: hidden !important;
}

/* Enlace interno */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce-loop-product__link,
.wc-block-grid__product-link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  flex-grow: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  text-decoration: none !important;
}

/* 5. FOTOGRAFÍAS CON PROPORCIÓN BLINDADA (NO SE DEFORMAN CON EL AUMENTO) */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img,
.woocommerce ul.products li.product a img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important; /* Proporción cuadrada exacta */
  max-height: 180px !important;
  object-fit: contain !important;
  margin: 0 auto 6px auto !important;
  display: block !important;
}

/* 6. ENUNCIADOS (TÍTULOS) EN MINÚSCULA CON TAMAÑO AUTO-CALIBRADO */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.ast-loop-product__title {
  text-transform: lowercase !important;
  font-variant: normal !important;
  /* Se adapta inteligentemente si el usuario sube el nivelador de zoom */
  font-size: clamp(11px, 3.2vw, 13px) !important;
  line-height: 1.25 !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  min-height: 34px !important;
  max-height: 34px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 2px 0 4px 0 !important;
  padding: 0 !important;
  
  /* Bloquea la separación de letras en fila vertical */
  word-wrap: break-word !important;
  word-break: normal !important;
  white-space: normal !important;
  hyphens: none !important;
}

/* 7. PRECIO Y BOTONES CALIBRADOS AL MILÍMETRO */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 22px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 8px 0 !important;
  font-size: clamp(12px, 3.5vw, 14px) !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button,
.add_to_cart_button {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  margin-top: auto !important; /* Todos los botones alineados a la misma altura inferior */
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 8px !important;
  border-radius: 9999px !important;
  font-size: clamp(10.5px, 2.8vw, 12px) !important;
  font-weight: 700 !important;
  text-transform: lowercase !important;
  letter-spacing: 0.01em !important;
  white-space: nowrap !important;
  text-align: center !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.add_to_cart_button:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
}

/* 8. CABECERA FIJA SUPERIOR */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.ast-main-header-wrap,
.ast-primary-header-bar,
.main-header-bar,
.site-header.ast-mobile-header,
.ast-mobile-header-wrap {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 99999 !important;
  background-color: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06) !important;
}

/* 9. FOOTER APILADO EN MÓVIL */
@media screen and (max-width: 768px) {
  footer,
  .site-footer,
  .footer-widgets,
  .ast-footer {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    text-align: center !important;
    gap: 16px !important;
  }
}/* ==========================================================================
   VELLAPERFUMERIA.COM - CSS DEFINITIVO:
   1. BLOQUEO TOTAL DE ZOOM EXTERNO Y AUMENTO DE TEXTO (DESACTIVA FONT BOOSTING)
   2. CABECERA NORMAL Y LIBRE (SE QUITA LA CABECERA FIJA / STICKY)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. BLOQUEO DE ZOOM EXTERNO, MOTOR DE AUTO-AUMENTO Y GESTOS TÁCTILES
   -------------------------------------------------------------------------- */
html {
  /* Permite el scroll vertical normal pero bloquea el pellizco de zoom con dos dedos */
  touch-action: pan-y !important;
  -ms-touch-action: pan-y !important;
  
  /* Desactiva por completo el auto-aumento del navegador */
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
  text-size-adjust: none !important;
  
  /* Bloquea zoom y escalas externas */
  zoom: 1 !important;
  -webkit-transform: none !important;
  transform: none !important;
  
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

body {
  touch-action: pan-y !important;
  -webkit-touch-callout: none !important;
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
  text-size-adjust: none !important;
  zoom: 1 !important;
  -webkit-transform: none !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

/* Truco universal: anula el motor de auto-inflación (Font Boosting) de Chrome y Safari */
*, *::before, *::after {
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
  text-size-adjust: none !important;
  max-height: 999999px !important; /* Desactiva el cálculo automático de incremento de texto */
  box-sizing: border-box !important;
}

/* --------------------------------------------------------------------------
   2. CONGELAR TAMAÑOS DE TEXTO (NO SE PUEDEN AUMENTAR NI INFLAR)
   -------------------------------------------------------------------------- */
p, span, a, li, label, input, textarea, button, select, 
b, strong, em, i, td, th, div:not([class*="icon"]):not([class*="logo"]) {
  font-size: 14px !important;
  line-height: 1.4 !important;
  zoom: 1 !important;
  transform: none !important;
}

h1, .h1 { font-size: 22px !important; line-height: 1.25 !important; }
h2, .h2 { font-size: 18px !important; line-height: 1.3 !important; }
h3, .h3 { font-size: 16px !important; line-height: 1.35 !important; }
h4, h5, h6 { font-size: 14px !important; line-height: 1.4 !important; }

/* Neutraliza cualquier clase que intente aplicar zoom o agrandar letra */
[class*="font-size"],
[class*="text-size"],
[class*="larger"],
[class*="zoom"],
[style*="font-size"],
.accessibility-large-text,
.large-font,
.font-resizer-active {
  zoom: 1 !important;
  transform: none !important;
  -webkit-transform: none !important;
}

/* --------------------------------------------------------------------------
   3. SE QUITA LA CABECERA FIJA (LA CABECERA RUEDA CON EL SCROLL NATURAL)
   -------------------------------------------------------------------------- */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.ast-main-header-wrap,
.ast-primary-header-bar,
.main-header-bar,
.site-header.ast-mobile-header,
.ast-mobile-header-wrap,
div[data-elementor-type="header"] {
  position: static !important; /* Quita el modo fijo */
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: auto !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   4. ANCHO COMPLETO SIN MÁRGENES EXPANSIVOS (LA WEB NO SE ENSANCHA NI ENCOGE)
   -------------------------------------------------------------------------- */
#page,
.site,
.site-content,
.content-area,
main,
#main,
.site-main,
.entry-content,
.wp-site-blocks,
.ast-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-section,
.wp-block-group,
.hentry,
.wp-block-html,
.custom-html-widget {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
  box-sizing: border-box !important;
}

@media screen and (min-width: 769px) {
  #page,
  .site-content,
  .ast-container,
  .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

img, video, iframe {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box !important;
}

/* --------------------------------------------------------------------------
   5. TIENDA: 2 PRODUCTOS POR FILA CON CALIBRACIÓN FIJA
   -------------------------------------------------------------------------- */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products,
ul.products.columns-2,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

/* Tarjeta individual */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product,
.woocommerce .products .product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  background-color: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03) !important;
}

/* Imagen fija */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img,
.woocommerce ul.products li.product a img {
  height: 190px !important;
  max-height: 190px !important;
  min-height: 190px !important;
  width: 100% !important;
  object-fit: contain !important;
  margin: 0 auto 10px auto !important;
  display: block !important;
}

@media screen and (max-width: 640px) {
  .woocommerce ul.products li.product img,
  .woocommerce-loop-product__link img,
  .wc-block-grid__product-image img,
  .woocommerce ul.products li.product a img {
    height: 150px !important;
    max-height: 150px !important;
    min-height: 150px !important;
  }
}

/* Títulos en minúscula de 2 líneas fijas */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.ast-loop-product__title {
  text-transform: lowercase !important;
  font-variant: normal !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 4px 0 6px 0 !important;
  padding: 0 !important;
  word-wrap: break-word !important;
  word-break: normal !important;
  hyphens: none !important;
}

/* Botones al fondo */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 10px 0 !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button,
.add_to_cart_button {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin-top: auto !important;
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.add_to_cart_button:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* --------------------------------------------------------------------------
   6. FOOTER APILADO VERTICALMENTE EN MÓVILES
   -------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  footer,
  .site-footer,
  .footer-widgets,
  .site-below-footer-wrap,
  .ast-footer,
  #colophon,
  footer .footer-grid-container,
  footer .grid {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    text-align: center !important;
    gap: 24px !important;
  }

  footer .widget,
  .site-footer .widget,
  footer > div,
  .footer-widgets > div {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  footer ul,
  .site-footer ul {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }
}
/* ==========================================================================
   VELLAPERFUMERIA.COM - CSS DEFINITIVO:
   1. BLOQUEO TOTAL DE ZOOM EXTERNO Y AUMENTO DE TEXTO (DESACTIVA FONT BOOSTING)
   2. CABECERA NORMAL Y LIBRE (SE QUITA LA CABECERA FIJA / STICKY)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. BLOQUEO DE ZOOM EXTERNO, MOTOR DE AUTO-AUMENTO Y GESTOS TÁCTILES
   -------------------------------------------------------------------------- */
html {
  /* Permite el scroll vertical normal pero bloquea el pellizco de zoom con dos dedos */
  touch-action: pan-y !important;
  -ms-touch-action: pan-y !important;
  
  /* Desactiva por completo el auto-aumento del navegador */
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
  text-size-adjust: none !important;
  
  /* Bloquea zoom y escalas externas */
  zoom: 1 !important;
  -webkit-transform: none !important;
  transform: none !important;
  
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

body {
  touch-action: pan-y !important;
  -webkit-touch-callout: none !important;
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
  text-size-adjust: none !important;
  zoom: 1 !important;
  -webkit-transform: none !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

/* Truco universal: anula el motor de auto-inflación (Font Boosting) de Chrome y Safari */
*, *::before, *::after {
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
  text-size-adjust: none !important;
  max-height: 999999px !important; /* Desactiva el cálculo automático de incremento de texto */
  box-sizing: border-box !important;
}

/* --------------------------------------------------------------------------
   2. CONGELAR TAMAÑOS DE TEXTO (NO SE PUEDEN AUMENTAR NI INFLAR)
   -------------------------------------------------------------------------- */
p, span, a, li, label, input, textarea, button, select, 
b, strong, em, i, td, th, div:not([class*="icon"]):not([class*="logo"]) {
  font-size: 14px !important;
  line-height: 1.4 !important;
  zoom: 1 !important;
  transform: none !important;
}

h1, .h1 { font-size: 22px !important; line-height: 1.25 !important; }
h2, .h2 { font-size: 18px !important; line-height: 1.3 !important; }
h3, .h3 { font-size: 16px !important; line-height: 1.35 !important; }
h4, h5, h6 { font-size: 14px !important; line-height: 1.4 !important; }

/* Neutraliza cualquier clase que intente aplicar zoom o agrandar letra */
[class*="font-size"],
[class*="text-size"],
[class*="larger"],
[class*="zoom"],
[style*="font-size"],
.accessibility-large-text,
.large-font,
.font-resizer-active {
  zoom: 1 !important;
  transform: none !important;
  -webkit-transform: none !important;
}

/* --------------------------------------------------------------------------
   3. SE QUITA LA CABECERA FIJA (LA CABECERA RUEDA CON EL SCROLL NATURAL)
   -------------------------------------------------------------------------- */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.ast-main-header-wrap,
.ast-primary-header-bar,
.main-header-bar,
.site-header.ast-mobile-header,
.ast-mobile-header-wrap,
div[data-elementor-type="header"] {
  position: static !important; /* Quita el modo fijo */
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: auto !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   4. ANCHO COMPLETO SIN MÁRGENES EXPANSIVOS (LA WEB NO SE ENSANCHA NI ENCOGE)
   -------------------------------------------------------------------------- */
#page,
.site,
.site-content,
.content-area,
main,
#main,
.site-main,
.entry-content,
.wp-site-blocks,
.ast-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-section,
.wp-block-group,
.hentry,
.wp-block-html,
.custom-html-widget {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
  box-sizing: border-box !important;
}

@media screen and (min-width: 769px) {
  #page,
  .site-content,
  .ast-container,
  .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

img, video, iframe {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box !important;
}

/* --------------------------------------------------------------------------
   5. TIENDA: 2 PRODUCTOS POR FILA CON CALIBRACIÓN FIJA
   -------------------------------------------------------------------------- */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products,
ul.products.columns-2,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

/* Tarjeta individual */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product,
.woocommerce .products .product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  background-color: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03) !important;
}

/* Imagen fija */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img,
.woocommerce ul.products li.product a img {
  height: 190px !important;
  max-height: 190px !important;
  min-height: 190px !important;
  width: 100% !important;
  object-fit: contain !important;
  margin: 0 auto 10px auto !important;
  display: block !important;
}

@media screen and (max-width: 640px) {
  .woocommerce ul.products li.product img,
  .woocommerce-loop-product__link img,
  .wc-block-grid__product-image img,
  .woocommerce ul.products li.product a img {
    height: 150px !important;
    max-height: 150px !important;
    min-height: 150px !important;
  }
}

/* Títulos en minúscula de 2 líneas fijas */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.ast-loop-product__title {
  text-transform: lowercase !important;
  font-variant: normal !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 4px 0 6px 0 !important;
  padding: 0 !important;
  word-wrap: break-word !important;
  word-break: normal !important;
  hyphens: none !important;
}

/* Botones al fondo */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 10px 0 !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button,
.add_to_cart_button {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin-top: auto !important;
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.add_to_cart_button:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* --------------------------------------------------------------------------
   6. FOOTER APILADO VERTICALMENTE EN MÓVILES
   -------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  footer,
  .site-footer,
  .footer-widgets,
  .site-below-footer-wrap,
  .ast-footer,
  #colophon,
  footer .footer-grid-container,
  footer .grid {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    text-align: center !important;
    gap: 24px !important;
  }

  footer .widget,
  .site-footer .widget,
  footer > div,
  .footer-widgets > div {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  footer ul,
  .site-footer ul {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }
}
/* ==========================================================================
   VELLAPERFUMERIA.COM - CSS DE BLOQUEO DE NIVEL DE TEXTO Y CABECERA FIJA
   ========================================================================== */

/* 1. PERMITIR CABECERA FIJA Y CONTROL DE DESBORDES */
html,
body {
  overflow-x: clip !important;
  overflow-y: visible !important;
  touch-action: pan-y !important;
  -webkit-touch-callout: none !important;
  -webkit-text-size-adjust: none !important;
  -moz-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
  text-size-adjust: none !important;
  zoom: 1 !important;
  -webkit-transform: none !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
  -webkit-text-size-adjust: none !important;
  text-size-adjust: none !important;
  max-height: 999999px !important; /* Desactiva el auto-aumento de Chrome/Safari */
}

/* 2. BLOQUEO TOTAL DE AUMENTO Y DISMINUCIÓN (SUBIR/BAJAR NIVEL BLOQUEADO)
   Anula cualquier script, plugin, botón o estilo en línea que intente cambiar el tamaño */
html, html *,
body, body *,
#page, #page *,
.site, .site *,
.entry-content, .entry-content *,
[style*="font-size"] {
  font-size: 14px !important;
  line-height: 1.4 !important;
  zoom: 1 !important;
  transform: none !important;
  -webkit-transform: none !important;
}

/* Encabezados congelados a su escala exacta para que tampoco cambien de nivel */
h1, h1 *, .h1 { font-size: 22px !important; line-height: 1.25 !important; }
h2, h2 *, .h2 { font-size: 18px !important; line-height: 1.3 !important; }
h3, h3 *, .h3 { font-size: 16px !important; line-height: 1.35 !important; }
h4, h4 *, h5, h5 *, h6, h6 * { font-size: 14px !important; line-height: 1.4 !important; }

/* Neutraliza clases dinámicas de nivel (+ / -), zoom y redimensionamiento */
[class*="font-size"],
[class*="text-size"],
[class*="larger"],
[class*="smaller"],
[class*="zoom"],
[class*="nivel"],
[class*="level"],
.accessibility-large-text,
.accessibility-small-text,
.large-font,
.small-font,
.font-resizer-active {
  font-size: inherit !important;
  zoom: 1 !important;
  transform: none !important;
}

/* 3. CABECERA FIJA SIEMPRE EN TODAS LAS PÁGINAS (TOTALMENTE FUNCIONAL) */
header,
.site-header,
#masthead,
.elementor-location-header,
.wp-block-template-part[role="banner"],
.ast-main-header-wrap,
.ast-primary-header-bar,
.main-header-bar,
.site-header.ast-mobile-header,
.ast-mobile-header-wrap,
div[data-elementor-type="header"],
.oceanwp-header,
.storefront-primary-navigation {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 999999 !important; /* Siempre por encima de todo el contenido */
  background-color: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06) !important;
}

/* 4. ANCHO COMPLETO SIN MÁRGENES EXPANSIVOS */
#page,
.site,
.site-content,
.content-area,
main,
#main,
.site-main,
.entry-content,
.wp-site-blocks,
.ast-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-section,
.wp-block-group,
.hentry,
.wp-block-html,
.custom-html-widget {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
  box-sizing: border-box !important;
}

@media screen and (min-width: 769px) {
  #page,
  .site-content,
  .ast-container,
  .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

img, video, iframe {
  max-width: 100% !important;
  height: auto;
  box-sizing: border-box !important;
}

/* 5. TIENDA: 2 PRODUCTOS POR FILA CON CALIBRACIÓN FIJA */
.woocommerce ul.products,
.woocommerce-page ul.products,
.products,
ul.products.columns-2,
ul.products.columns-3,
ul.products.columns-4,
.wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

/* Tarjeta individual */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product,
.woocommerce .products .product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-height: 100% !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  background-color: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid #f0edea !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03) !important;
}

/* Imagen fija */
.woocommerce ul.products li.product img,
.woocommerce-loop-product__link img,
.wc-block-grid__product-image img,
.woocommerce ul.products li.product a img {
  height: 190px !important;
  max-height: 190px !important;
  min-height: 190px !important;
  width: 100% !important;
  object-fit: contain !important;
  margin: 0 auto 10px auto !important;
  display: block !important;
}

@media screen and (max-width: 640px) {
  .woocommerce ul.products li.product img,
  .woocommerce-loop-product__link img,
  .wc-block-grid__product-image img,
  .woocommerce ul.products li.product a img {
    height: 150px !important;
    max-height: 150px !important;
    min-height: 150px !important;
  }
}

/* Títulos en minúscula fijados a 13.5px */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
h2.woocommerce-loop-product__title,
h3.woocommerce-loop-product__title,
.ast-loop-product__title {
  font-size: 13.5px !important;
  text-transform: lowercase !important;
  font-variant: normal !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  margin: 4px 0 6px 0 !important;
  padding: 0 !important;
  word-wrap: break-word !important;
  word-break: normal !important;
  hyphens: none !important;
}

/* Botones al fondo en minúscula */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.price {
  min-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto 0 10px 0 !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #c2185b !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.woocommerce-loop-product__link + .button,
.add_to_cart_button {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin-top: auto !important;
  margin-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.add_to_cart_button:hover {
  background-color: #c2185b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* 6. FOOTER APILADO VERTICALMENTE EN MÓVILES */
@media screen and (max-width: 768px) {
  footer,
  .site-footer,
  .footer-widgets,
  .site-below-footer-wrap,
  .ast-footer,
  #colophon,
  footer .footer-grid-container,
  footer .grid {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    text-align: center !important;
    gap: 24px !important;
  }

  footer .widget,
  .site-footer .widget,
  footer > div,
  .footer-widgets > div {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  footer ul,
  .site-footer ul {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }
}