/* =========================================================
   SAT – STORE GRID PRO (CSS PURO)
   Contenedor real: #wcfmmp-store ul.products
   Desktop: 5 | Mobile: 2
========================================================= */

/* Grid base */
#wcfmmp-store ul.products{
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
  margin: 14px 0 10px 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Mobile: 2 columnas */
@media (max-width: 767px){
  #wcfmmp-store ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

/* Pisar el layout de Woo (floats/widths) */
#wcfmmp-store ul.products > li.product{
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  clear: none !important;
}

/* Tarjeta PRO */
#wcfmmp-store ul.products > li.product{
  position: relative;
  padding: 12px !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.08) !important;
  overflow: hidden !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, filter .22s ease;
}

#wcfmmp-store ul.products > li.product:hover{
  transform: translateY(-4px);
  box-shadow: 0 18px 42px rgba(0,0,0,.14) !important;
  border-color: rgba(0,0,0,.14) !important;
  filter: saturate(1.02);
}

/* Imagen pareja */
#wcfmmp-store ul.products > li.product img{
  width: 100% !important;
  border-radius: 14px !important;
  margin: 0 0 10px 0 !important;
  object-fit: cover !important;
  aspect-ratio: 1/1;
  transition: transform .28s ease;
}

#wcfmmp-store ul.products > li.product:hover img{
  transform: scale(1.04);
}

/* Título + precio */
#wcfmmp-store .woocommerce-loop-product__title{
  font-size: 14px !important;
  line-height: 1.25 !important;
  margin: 6px 0 8px 0 !important;
  font-weight: 800 !important;
  color: #111 !important;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#wcfmmp-store .price{
  font-size: 15px !important;
  font-weight: 900 !important;
}
/* Botones/links no se deforman */
#wcfmmp-store ul.products > li.product a{
  text-decoration: none !important;
}

/* Un poquito más de aire abajo del precio */
#wcfmmp-store ul.products > li.product .price{
  display: inline-block;
  margin-top: 6px !important;
}
@media (min-width: 768px) and (max-width: 1024px){
  #wcfmmp-store ul.products{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
/* =========================================================
   SAT – POWER PRO V2 (visible + premium)
   Apunta a la estructura real: ul.products.columns-5 > li.product
========================================================= */

/* Card más premium: borde fino + sombra real */
#wcfmmp-store ul.products.columns-5 > li.product{
  border: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.12) !important;
  background: #fff !important;
}

/* Hover marketing (se nota) */
#wcfmmp-store ul.products.columns-5 > li.product:hover{
  transform: translateY(-6px) !important;
  box-shadow: 0 26px 70px rgba(0,0,0,.20) !important;
  border-color: rgba(0,0,0,.16) !important;
}

/* Imagen: “marco” sutil y más presencia */
#wcfmmp-store ul.products.columns-5 > li.product a img{
  border-radius: 16px !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.10) !important;
}

/* Título más “marca” */
#wcfmmp-store ul.products.columns-5 > li.product .woocommerce-loop-product__title{
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: .1px;
}

/* Precio más protagonista */
#wcfmmp-store ul.products.columns-5 > li.product .price{
  font-size: 16px !important;
  font-weight: 950 !important;
}

/* Si hay oferta: que venda */
#wcfmmp-store ul.products.columns-5 > li.product .price del{
  opacity: .55 !important;
  font-weight: 700 !important;
  margin-right: 6px !important;
}
#wcfmmp-store ul.products.columns-5 > li.product .price ins{
  text-decoration: none !important;
  font-weight: 950 !important;
}

/* Badge “OFERTA” solo si el producto está en oferta (Woo agrega .onsale) */
#wcfmmp-store ul.products.columns-5 > li.product .onsale{
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
  bottom: auto !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  line-height: 1 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .6px !important;
  z-index: 50 !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.18) !important;
}

/* Botón (si existe): más CTA */
#wcfmmp-store ul.products.columns-5 > li.product a.button{
  border-radius: 999px !important;
  padding: 10px 14px !important;
  font-weight: 950 !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.16) !important;
}
#wcfmmp-store ul.products.columns-5 > li.product a.button:hover{
  transform: translateY(-2px);
  filter: brightness(1.03);
}

/* Mobile: un poco más compacto */
@media (max-width: 767px){
  #wcfmmp-store ul.products.columns-5 > li.product{
    padding: 10px !important;
  }
}
/* =========================================================
   SAT – POWER FINAL (premium + marketing)
   Apunta al contenedor real sin depender de columns-x
========================================================= */

/* Card más premium */
#wcfmmp-store ul.products > li.product{
  border: 1px solid rgba(0,0,0,.12) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.14) !important;
  transform: translateY(0) !important;
}

/* “Brillito” sutil arriba (se ve más tema pro) */
#wcfmmp-store ul.products > li.product::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:54px;
  background: linear-gradient(180deg, rgba(0,0,0,.06), transparent);
  opacity:.55;
  pointer-events:none;
}

/* Hover que vende */
#wcfmmp-store ul.products > li.product:hover{
  transform: translateY(-7px) !important;
  box-shadow: 0 34px 90px rgba(0,0,0,.22) !important;
  border-color: rgba(0,0,0,.18) !important;
  filter: saturate(1.02);
}

/* Imagen más protagonista */
#wcfmmp-store ul.products > li.product a img{
  border-radius: 16px !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.12) !important;
}

/* Título más “marca” */
#wcfmmp-store ul.products > li.product .woocommerce-loop-product__title{
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: .1px;
}

/* Precio más “CTA” */
#wcfmmp-store ul.products > li.product .price{
  font-size: 17px !important;
  font-weight: 950 !important;
}

/* Ofertas: que se note el descuento */
#wcfmmp-store ul.products > li.product .price del{
  opacity: .55 !important;
  font-weight: 700 !important;
  margin-right: 6px !important;
}
#wcfmmp-store ul.products > li.product .price ins{
  text-decoration: none !important;
  font-weight: 950 !important;
}

/* Botón (si existe): más vendible */
#wcfmmp-store ul.products > li.product a.button{
  border-radius: 999px !important;
  padding: 10px 14px !important;
  font-weight: 950 !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.16) !important;
}
#wcfmmp-store ul.products > li.product a.button:hover{
  transform: translateY(-2px);
  filter: brightness(1.03);
}

/* Mobile: un poco más compacto */
@media (max-width: 767px){
  #wcfmmp-store ul.products > li.product{
    border-radius: 16px !important;
  }
}