/* =========================================================
   SIMONA V2 - CATÁLOGO
   Loop Grid real: Elementor #7e148e2
   Loop Item real: Elementor template #279
   ========================================================= */

/* ---------- ESCRITORIO: 5 TARJETAS ---------- */
@media (min-width: 1025px) {

  /* El Loop Grid real del catálogo */
  .elementor-element-7e148e2 .elementor-loop-container.elementor-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: 16px !important;
    row-gap: 18px !important;
    width: 100% !important;
  }

  /* Cada producto del Loop Item #279 */
  .elementor-element-7e148e2 .elementor-279.e-loop-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  /* Contenedor principal de la tarjeta */
  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-d44863b {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 330px !important;
    height: 100% !important;

    padding: 0 !important;
    overflow: hidden !important;

    background: #ffffff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 16px !important;

    box-shadow: 0 3px 14px rgba(0,0,0,.06) !important;
    transition: transform .2s ease, box-shadow .2s ease !important;
  }

  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-d44863b:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(0,0,0,.10) !important;
  }

  /* Eliminar anchos fijos heredados del diseño anterior */
  .elementor-element-7e148e2 .elementor-279 .product_wrapper,
  .elementor-element-7e148e2 .elementor-279 .e-con,
  .elementor-element-7e148e2 .elementor-279 .elementor-widget {
    max-width: 100% !important;
  }

  .elementor-element-7e148e2 .elementor-279 .product_wrapper {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Zona de imagen */
  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-0b9f4b1 {
    padding: 10px 10px 0 !important;
    overflow: hidden !important;
  }

  /* Imagen real */
  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-56ae264 img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 155px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
  }

  /* Título */
  .elementor-element-7e148e2 .elementor-279 .product_title,
  .elementor-element-7e148e2 .elementor-279 .woocommerce-loop-product__title {
    font-size: 13px !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
    color: #303030 !important;
    min-height: 33px !important;
    margin: 6px 0 !important;
  }

  /* Precio */
  .elementor-element-7e148e2 .elementor-279 .price {
    font-size: 17px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    color: #159447 !important;
  }

  /* Comprar */
  .elementor-element-7e148e2 .elementor-279 .button,
  .elementor-element-7e148e2 .elementor-279 .add_to_cart_button {
    border-radius: 8px !important;
  }
}


/* ---------- TABLET: 4 TARJETAS ---------- */
@media (min-width: 768px) and (max-width: 1024px) {

  .elementor-element-7e148e2 .elementor-loop-container.elementor-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-d44863b {
    min-height: 315px !important;
    border-radius: 13px !important;
  }

  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-56ae264 img {
    height: 135px !important;
    object-fit: contain !important;
  }
}


/* ---------- CELULAR: 3 TARJETAS ---------- */
@media (max-width: 767px) {

  .elementor-element-7e148e2 .elementor-loop-container.elementor-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  .elementor-element-7e148e2 .elementor-279.e-loop-item {
    width: 100% !important;
    min-width: 0 !important;
  }

  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-d44863b {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 255px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
  }

  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-0b9f4b1 {
    padding: 5px 5px 0 !important;
  }

  .elementor-element-7e148e2
  .elementor-279
  .elementor-element-56ae264 img {
    width: 100% !important;
    height: 95px !important;
    object-fit: contain !important;
  }

  .elementor-element-7e148e2 .elementor-279 .product_title,
  .elementor-element-7e148e2 .elementor-279 .woocommerce-loop-product__title {
    font-size: 10px !important;
    line-height: 1.15 !important;
    min-height: 25px !important;
  }

  .elementor-element-7e148e2 .elementor-279 .price {
    font-size: 13px !important;
  }

  .elementor-element-7e148e2 .elementor-279 .button,
  .elementor-element-7e148e2 .elementor-279 .add_to_cart_button {
    font-size: 9px !important;
    padding: 7px 3px !important;
  }
}


/* =========================================================
   SIMONA V2 - CATEGORÍAS EN MENÚ COMPACTO
   Oculta la columna lateral antigua y libera el ancho
   ========================================================= */

/* Ocultar únicamente el filtro lateral de categorías en archivos WooCommerce */
body.woocommerce.archive .c-filters,
body.archive.woocommerce .c-filters {
  display: none !important;
  width: 0 !important;
  max-width: 0 !important;
  min-width: 0 !important;
  flex: 0 0 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Hacer que el bloque del catálogo, si es hermano del filtro lateral,
   aproveche todo el espacio liberado */
body.woocommerce.archive .c-filters + *,
body.woocommerce.archive .c-filters ~ *,
body.archive.woocommerce .c-filters + *,
body.archive.woocommerce .c-filters ~ * {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
}

/* El grid real conserva cinco columnas en escritorio */
@media (min-width: 1025px) {
  body.woocommerce.archive
  .elementor-element-7e148e2
  .elementor-loop-container.elementor-grid,
  body.archive.woocommerce
  .elementor-element-7e148e2
  .elementor-loop-container.elementor-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    width: 100% !important;
  }
}

/* Mantener disponible el popup de categorías existente de Elementor
   para que pueda abrirse desde el botón superior "Categorías". */
.elementor-642.elementor-location-popup {
  /* No forzamos display aquí: Elementor controla abrir/cerrar el popup. */
}



/* =========================================================
   SIMONA V2 - CABECERA COMPACTA DE CATEGORÍA
   Oculta el bloque grande de icono + título y convierte
   las subcategorías WooCommerce en una barra horizontal.
   ========================================================= */

/* Bloque grande actual: imagen + título de la categoría */
body.woocommerce.archive .elementor-element-81617cf,
body.archive.woocommerce .elementor-element-81617cf {
  display: none !important;
}

/* Barra de subcategorías compacta */
body.woocommerce.archive .elementor-widget-wc-categories,
body.archive.woocommerce .elementor-widget-wc-categories {
  width: 100% !important;
  max-width: 100% !important;
  margin: 10px 0 14px !important;
  padding: 0 10px !important;
  box-sizing: border-box !important;
}

/* Contenedor horizontal desplazable */
body.woocommerce.archive .elementor-widget-wc-categories ul.products,
body.archive.woocommerce .elementor-widget-wc-categories ul.products {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  flex-wrap: nowrap !important;
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 4px 2px 9px !important;
  scroll-behavior: smooth;
  scrollbar-width: thin;
}

/* Cada categoría deja de ser una tarjeta grande */
body.woocommerce.archive .elementor-widget-wc-categories li.product-category,
body.archive.woocommerce .elementor-widget-wc-categories li.product-category {
  flex: 0 0 auto !important;
  min-width: auto !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Botón tipo chip */
body.woocommerce.archive .elementor-widget-wc-categories li.product-category > a,
body.archive.woocommerce .elementor-widget-wc-categories li.product-category > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: row !important;
  gap: 6px !important;

  min-height: 34px !important;
  padding: 7px 13px !important;

  background: #ffffff !important;
  color: #2d2d2d !important;
  border: 1px solid #dfe7df !important;
  border-radius: 999px !important;

  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;

  box-shadow: 0 2px 8px rgba(0,0,0,.05) !important;
  transition: all .18s ease !important;
}

/* Quitamos las imágenes circulares grandes */
body.woocommerce.archive .elementor-widget-wc-categories li.product-category img,
body.archive.woocommerce .elementor-widget-wc-categories li.product-category img {
  display: none !important;
}

/* Nombre de categoría compacto */
body.woocommerce.archive .elementor-widget-wc-categories .woocommerce-loop-category__title,
body.archive.woocommerce .elementor-widget-wc-categories .woocommerce-loop-category__title {
  display: inline !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;

  color: inherit !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* Ocultar contador */
body.woocommerce.archive .elementor-widget-wc-categories .count,
body.archive.woocommerce .elementor-widget-wc-categories .count {
  display: none !important;
}

/* Hover verde SIMONA */
body.woocommerce.archive .elementor-widget-wc-categories li.product-category > a:hover,
body.archive.woocommerce .elementor-widget-wc-categories li.product-category > a:hover {
  background: #159447 !important;
  border-color: #159447 !important;
  color: #ffffff !important;
  transform: translateY(-1px);
}

/* En móvil, todavía más compacta */
@media (max-width: 767px) {
  body.woocommerce.archive .elementor-widget-wc-categories,
  body.archive.woocommerce .elementor-widget-wc-categories {
    margin: 6px 0 10px !important;
    padding: 0 6px !important;
  }

  body.woocommerce.archive .elementor-widget-wc-categories li.product-category > a,
  body.archive.woocommerce .elementor-widget-wc-categories li.product-category > a {
    min-height: 30px !important;
    padding: 6px 10px !important;
    font-size: 11px !important;
  }

  body.woocommerce.archive .elementor-widget-wc-categories .woocommerce-loop-category__title,
  body.archive.woocommerce .elementor-widget-wc-categories .woocommerce-loop-category__title {
    font-size: 11px !important;
  }
}


/* =========================================================
   SIMONA V2 - CORRECCIÓN DE DESBORDAMIENTO HORIZONTAL
   Solo la barra de categorías puede desplazarse lateralmente.
   ========================================================= */

/* La página completa nunca debe desplazarse de lado */
html,
body {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* El widget y sus contenedores no pueden ensanchar la página */
body.woocommerce.archive .elementor-widget-wc-categories,
body.archive.woocommerce .elementor-widget-wc-categories,
body.woocommerce.archive .elementor-widget-wc-categories > .elementor-widget-container,
body.archive.woocommerce .elementor-widget-wc-categories > .elementor-widget-container {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* ÚNICAMENTE esta fila puede desplazarse horizontalmente */
body.woocommerce.archive .elementor-widget-wc-categories ul.products,
body.archive.woocommerce .elementor-widget-wc-categories ul.products {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;

  overflow-x: auto !important;
  overflow-y: hidden !important;
  flex-wrap: nowrap !important;

  margin: 0 !important;
  padding: 4px 2px 9px !important;
  box-sizing: border-box !important;

  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}

/* Cada chip conserva su ancho natural sin estirar el documento */
body.woocommerce.archive .elementor-widget-wc-categories li.product-category,
body.archive.woocommerce .elementor-widget-wc-categories li.product-category {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* Evitar que cualquier contenedor del archivo fuerce un ancho superior */
body.woocommerce.archive .elementor-location-archive,
body.archive.woocommerce .elementor-location-archive,
body.woocommerce.archive .elementor-location-archive .e-con,
body.archive.woocommerce .elementor-location-archive .e-con {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}


/* =========================================================
   SIMONA V2 - NAVEGACIÓN VERDE PRINCIPAL
   Convierte la barra verde existente en una fila horizontal
   de categorías reales de WooCommerce.
   ========================================================= */

/* Contenedor verde existente */
.elementor-element-34eff5d9 {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

/* Interior: una sola línea y sin desbordar la página */
.elementor-element-34eff5d9 > .e-con-inner {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

/* El bloque de categorías ocupa el espacio disponible */
.elementor-element-39ca4e23 {
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

/* Quitamos el botón antiguo "Categorías" */
.elementor-element-e489618 {
  display: none !important;
}

/* El antiguo menú desplegable pasa a formar parte de la barra */
.elementor-element-bc905fa {
  position: static !important;
  inset: auto !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: hidden !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

/* Menú principal en horizontal y desplazable */
.elementor-element-a363c21 .elementor-nav-menu--main {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
}

/* Solo usamos la copia principal del menú */
.elementor-element-a363c21 > .elementor-widget-container > .elementor-nav-menu--dropdown {
  display: none !important;
}

.elementor-element-a363c21 .elementor-nav-menu--main > ul.elementor-nav-menu {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 4px !important;
  width: max-content !important;
  min-width: 100% !important;
  margin: 0 !important;
  padding: 4px 6px !important;
}

/* Cada categoría se convierte en un botón compacto */
.elementor-element-a363c21 .elementor-nav-menu--main > ul > li.menu-item {
  position: relative !important;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* No desplegamos subcategorías dentro de esta barra */
.elementor-element-a363c21 .elementor-nav-menu--main > ul > li > ul.sub-menu,
.elementor-element-a363c21 .elementor-nav-menu--main .sub-arrow {
  display: none !important;
}

/* Estilo de los botones */
.elementor-element-a363c21 .elementor-nav-menu--main > ul > li > a.elementor-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 7px 12px !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

.elementor-element-a363c21 .elementor-nav-menu--main > ul > li > a.elementor-item:hover,
.elementor-element-a363c21 .elementor-nav-menu--main > ul > li > a.elementor-item.elementor-item-active {
  background: #fff !important;
  color: #159447 !important;
  border-color: #fff !important;
}

/* El bloque derecho conserva OFERTAS, pero retiramos Punto de venta
   de esta barra para poder llevarlo después al encabezado. */
.elementor-element-218d4e6c {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: auto !important;
}

.elementor-element-7e2416bb .elementor-icon-list-items {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Oculta únicamente el segundo elemento: Punto de venta */
.elementor-element-7e2416bb .elementor-icon-list-item:nth-child(2) {
  display: none !important;
}

/* OFERTAS destacado y compacto */
.elementor-element-7e2416bb .elementor-icon-list-item:first-child a {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 34px !important;
  padding: 7px 12px !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #159447 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

.elementor-element-7e2416bb .elementor-icon-list-item:first-child svg {
  width: 14px !important;
  height: 14px !important;
  fill: currentColor !important;
}

/* La segunda fila blanca de categorías ya no se necesita */
body.woocommerce.archive .elementor-widget-wc-categories,
body.archive.woocommerce .elementor-widget-wc-categories {
  display: none !important;
}

/* Ajuste móvil: botones aún más compactos */
@media (max-width: 767px) {
  .elementor-element-34eff5d9 > .e-con-inner {
    gap: 5px !important;
  }

  .elementor-element-a363c21 .elementor-nav-menu--main > ul > li > a.elementor-item,
  .elementor-element-7e2416bb .elementor-icon-list-item:first-child a {
    min-height: 32px !important;
    padding: 6px 10px !important;
    font-size: 11px !important;
  }
}


/* =========================================================
   SIMONA V2 - ENCABEZADO DESKTOP
   Selectores exactos del header actual.
   ========================================================= */

@media (min-width: 768px) {

  /* Header principal */
  .elementor-element-345a0a35 > .e-con-inner {
    display: flex !important;
    align-items: center !important;
    gap: 22px !important;
    width: 100% !important;
    max-width: 1380px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Logo: más presencia, sin exagerarlo */
  .elementor-element-4ba82c37 {
    flex: 0 0 165px !important;
    width: 165px !important;
    max-width: 165px !important;
  }

  .elementor-element-250bea18 img {
    width: 155px !important;
    max-width: 155px !important;
    height: auto !important;
    display: block !important;
  }

  /* Buscador: protagonista */
  .elementor-element-6c446df {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 380px !important;
  }

  .elementor-element-d062d51 {
    width: 100% !important;
    max-width: none !important;
  }

  .elementor-element-d062d51 .e-search-form {
    width: 100% !important;
    min-height: 52px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  .elementor-element-d062d51 .e-search-input-wrapper {
    flex: 1 1 auto !important;
  }

  .elementor-element-d062d51 .e-search-input {
    width: 100% !important;
    min-height: 52px !important;
    padding: 0 20px !important;
    font-size: 16px !important;
  }

  .elementor-element-d062d51 .e-search-submit {
    flex: 0 0 58px !important;
    width: 58px !important;
    min-width: 58px !important;
    min-height: 52px !important;
  }

  .elementor-element-d062d51 .e-search-submit svg {
    width: 20px !important;
    height: 20px !important;
  }

  /* Cuenta + carrito compactos para entregar ancho al buscador */
  .elementor-element-3f6a20c5 {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 220px !important;
  }

  .elementor-element-1363393 {
    display: none !important;
  }
}

/* =========================================================
   SIMONA V2 - OFERTAS LÍDER + SCROLL LIMPIO
   ========================================================= */

/* OFERTAS permanece fijo a la derecha del área desplazable,
   destacado en amarillo SIMONA */
.elementor-element-218d4e6c {
  order: -1 !important;
}

.elementor-element-7e2416bb .elementor-icon-list-item:first-child a {
  background: #FFD529 !important;
  color: #176B2C !important;
  border: 1px solid #FFD529 !important;
  box-shadow: 0 2px 7px rgba(0,0,0,.12) !important;
}

.elementor-element-7e2416bb .elementor-icon-list-item:first-child .elementor-icon-list-text {
  display: inline !important;
  color: #176B2C !important;
  font-weight: 900 !important;
}

.elementor-element-7e2416bb .elementor-icon-list-item:first-child svg,
.elementor-element-7e2416bb .elementor-icon-list-item:first-child svg path {
  fill: #176B2C !important;
}

/* Oculta la barra visual del scroll, pero conserva el desplazamiento */
.elementor-element-a363c21 .elementor-nav-menu--main {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.elementor-element-a363c21 .elementor-nav-menu--main::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* La fila de categorías tampoco debe dibujar scrollbar propio */
.elementor-element-a363c21 .elementor-nav-menu--main > ul.elementor-nav-menu {
  scrollbar-width: none !important;
}

/* En pantallas más estrechas mantenemos el buscador útil */
@media (min-width: 768px) and (max-width: 1050px) {
  .elementor-element-345a0a35 > .e-con-inner {
    gap: 12px !important;
  }

  .elementor-element-4ba82c37 {
    flex-basis: 135px !important;
    width: 135px !important;
  }

  .elementor-element-250bea18 img {
    width: 130px !important;
    max-width: 130px !important;
  }

  .elementor-element-6c446df {
    min-width: 300px !important;
  }

  .elementor-element-3f6a20c5 {
    min-width: 190px !important;
  }
}


/* =========================================================
   SIMONA V2 - AJUSTE SEGURO DE HOVER EN TARJETAS
   03-09-2026
   Solo corrige colores visuales. No altera lógica comercial.
   ========================================================= */

/* Neutraliza el rojo heredado del tema anterior */
body.woocommerce.archive
.product.type-product:not(.product-category):not(.elementor-location-single):hover
.product_wrapper,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.product_wrapper {
  background-color: #f2fbf1 !important;
}

/* Título siempre legible */
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.product_title,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.product_title a,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.woocommerce-loop-product__title {
  color: #171717 !important;
  -webkit-text-fill-color: #171717 !important;
  opacity: 1 !important;
}

/* Precio siempre verde y visible */
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.price,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.price *,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.price bdi,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.woocommerce-Price-amount,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.woocommerce-Price-currencySymbol {
  color: #159447 !important;
  -webkit-text-fill-color: #159447 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Controles de cantidad visibles sobre fondo blanco */
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.quantity,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.quantity input,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.quantity button,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.minus,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.plus {
  background: #ffffff !important;
  color: #171717 !important;
  -webkit-text-fill-color: #171717 !important;
  border-color: #9f9f9f !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Mantiene el botón actual visible; su rediseño a amarillo se hará aparte */
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.button,
body.woocommerce.archive
.elementor-279.e-loop-item.product:hover
.add_to_cart_button {
  opacity: 1 !important;
  visibility: visible !important;
}


/* =========================================================
   SIMONA V2 - TARJETAS MOBILE 3 COLUMNAS
   03-09-2026
   Solo afecta pantallas pequeñas. No altera lógica WooCommerce.
   ========================================================= */

@media (max-width: 767px) {

  body.woocommerce.archive
  .elementor-element-7e148e2
  .elementor-loop-container.elementor-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 8px !important;
    row-gap: 14px !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product {
    min-width: 0 !important;
    width: 100% !important;
    overflow: hidden !important;
    border-radius: 14px !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-d44863b {
    min-width: 0 !important;
    width: 100% !important;
    padding: 10px 8px 8px !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-0b9f4b1,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-56ae264 {
    height: 145px !important;
    min-height: 145px !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-56ae264 img {
    width: 100% !important;
    height: 145px !important;
    object-fit: contain !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .product_title,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .woocommerce-loop-product__title {
    font-size: 13px !important;
    line-height: 1.25 !important;
    min-height: 33px !important;
    max-height: 33px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    margin: 0 0 6px !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .price,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .price *,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .woocommerce-Price-amount {
    color: #159447 !important;
    -webkit-text-fill-color: #159447 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-9933da8
  .elementor-widget-container,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  form.cart,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .cart {
    width: 100% !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  form.cart {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    align-items: stretch !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .quantity {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) 28px !important;
    align-items: center !important;
    gap: 0 !important;
    margin: 0 !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .quantity input,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .quantity button,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .minus,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .plus {
    min-width: 0 !important;
    width: 100% !important;
    height: 34px !important;
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 34px !important;
    text-align: center !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .button,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .add_to_cart_button {
    width: 100% !important;
    min-width: 0 !important;
    height: 38px !important;
    padding: 0 6px !important;
    margin: 0 !important;
    border-radius: 9px !important;
    background: #FFD529 !important;
    border-color: #FFD529 !important;
    color: #176B2C !important;
    -webkit-text-fill-color: #176B2C !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 38px !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .button:hover,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .add_to_cart_button:hover {
    background: #f0c800 !important;
    border-color: #f0c800 !important;
    color: #176B2C !important;
    -webkit-text-fill-color: #176B2C !important;
  }

  body.woocommerce.archive
  .woocommerce-ordering {
    margin: 8px auto 16px !important;
    width: calc(100% - 32px) !important;
  }

  body.woocommerce.archive
  .woocommerce-ordering select {
    width: 100% !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 38px 0 12px !important;
    font-size: 14px !important;
    line-height: 42px !important;
  }
}


/* =========================================================
   SIMONA V2 - TARJETA MOBILE ESTILO CATÁLOGO
   03-09-2026
   3 columnas + cantidad + botón completo
   Solo afecta móvil. No altera lógica WooCommerce.
   ========================================================= */

@media (max-width: 767px) {

  /* Rejilla de 3 columnas */
  body.woocommerce.archive
  .elementor-element-7e148e2
  .elementor-loop-container.elementor-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px 8px !important;
  }

  /* Tarjeta */
  body.woocommerce.archive
  .elementor-279.e-loop-item.product {
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    border: 1px solid #e6e6e6 !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.08) !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-d44863b {
    width: 100% !important;
    min-width: 0 !important;
    padding: 10px 8px 9px !important;
  }

  /* Imagen */
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-0b9f4b1,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-56ae264 {
    height: 132px !important;
    min-height: 132px !important;
    margin-bottom: 8px !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-56ae264 img {
    width: 100% !important;
    height: 132px !important;
    object-fit: contain !important;
  }

  /* Nombre: máximo dos líneas y sin partir palabras */
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .product_title,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .woocommerce-loop-product__title {
    color: #222222 !important;
    -webkit-text-fill-color: #222222 !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    min-height: 31px !important;
    max-height: 31px !important;
    margin: 0 0 6px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }

  /* Precio en una sola línea */
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .price,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .price *,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .woocommerce-Price-amount,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .woocommerce-Price-currencySymbol {
    color: #159447 !important;
    -webkit-text-fill-color: #159447 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-e13437a {
    margin-bottom: 8px !important;
  }

  /* Zona de compra */
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-9933da8,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .elementor-element-9933da8 .elementor-widget-container,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  form.cart {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  form.cart {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    margin: 0 !important;
  }

  /* Selector de cantidad ancho y cómodo */
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .quantity {
    width: 100% !important;
    height: 34px !important;
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) 30px !important;
    align-items: stretch !important;
    margin: 0 !important;
    border: 1px solid #d7d7d7 !important;
    border-radius: 9px !important;
    overflow: hidden !important;
    background: #ffffff !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .quantity input,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .quantity button,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .minus,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .plus {
    width: 100% !important;
    min-width: 0 !important;
    height: 34px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-right: 1px solid #e4e4e4 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #1e1e1e !important;
    -webkit-text-fill-color: #1e1e1e !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 34px !important;
    text-align: center !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .quantity > *:last-child {
    border-right: 0 !important;
  }

  /* Botón principal */
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .button,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .add_to_cart_button {
    width: 100% !important;
    min-width: 0 !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 0 5px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: #FFD529 !important;
    color: #176B2C !important;
    -webkit-text-fill-color: #176B2C !important;
    font-size: 0 !important;
    font-weight: 800 !important;
    line-height: 38px !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .button::after,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .add_to_cart_button::after {
    content: "Agregar al carrito";
    font-size: 11.5px !important;
    line-height: 38px !important;
  }

  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .button:hover,
  body.woocommerce.archive
  .elementor-279.e-loop-item.product
  .add_to_cart_button:hover {
    background: #f2c900 !important;
    color: #176B2C !important;
    -webkit-text-fill-color: #176B2C !important;
  }

  /* Hover discreto */
  body.woocommerce.archive
  .elementor-279.e-loop-item.product:hover
  .product_wrapper {
    background: #f7fcf6 !important;
  }

  /* Ordenamiento más compacto */
  body.woocommerce.archive
  .woocommerce-ordering {
    width: calc(100% - 32px) !important;
    margin: 8px auto 16px !important;
  }

  body.woocommerce.archive
  .woocommerce-ordering select {
    width: 100% !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 38px 0 12px !important;
    font-size: 14px !important;
  }
}
