/* ===========================================================
   VARIABLES GLOBALES
   =========================================================== */
:root{
  --tv-grid-max:1190px;
  --tv-card-gap:28px;
  --tv-card-inset:12px;
  --tv-card-radius:14px;
  --tv-img-ratio:1/1;
  --tv-edge-m:16px;
  --tv-stack-gap:3px;
  --tv-cta-radius:14px;
  --tv-cta-gap:10px;
  --tv-cta-h-d:15px;
  --tv-cta-h-m:25px;
  --tv-cta-h:var(--tv-cta-h-d);
  --tv-price-ins-d:18px;
  --tv-price-del-d:18px;
  --tv-stars-size-d:15px;
  --tv-price-ins-m:15px;
  --tv-price-del-m:15px;
  --tv-stars-size-m:13px;
}

/* ===========================================================
   GRILLA (todas las páginas)
   =========================================================== */
.elementor .woocommerce>ul.products,
.elementor .woocommerce ul.products,
.archive.post-type-archive-product .columns-4>ul.products,
.tax-product_cat .columns-4>ul.products,
.woocommerce-page .site-main ul.products{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:var(--tv-card-gap)!important;
  list-style:none;
  padding:0!important;
  margin:0 auto!important;
  max-width:var(--tv-grid-max);
  box-sizing:border-box;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after{display:none!important}
.archive .site-content .columns-4,
.tax-product_cat .site-content .columns-4{
  margin:0!important;
  padding:0!important;
  box-sizing:border-box;
}

/* ===========================================================
   TARJETAS DE PRODUCTO
   =========================================================== */
.woocommerce ul.products li.product{
  margin:0!important;
  padding:0!important;
  width:auto!important;
  min-width:0;
  box-sizing:border-box;
  background:#fff;
  border-radius:var(--tv-card-radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  height:100%;
  box-shadow:0 1px 0 rgba(0,0,0,.04);
  transition:box-shadow .2s ease, transform .2s ease;
  position:relative;
  padding-bottom:calc(var(--tv-cta-h) + var(--tv-card-inset) + var(--tv-cta-gap))!important;
}
.woocommerce ul.products li.product:hover{
  box-shadow:0 10px 24px rgba(0,0,0,.08),0 2px 6px rgba(0,0,0,.06);
  transform:translateY(-2px);
}

/* ===========================================================
   IMAGEN
   =========================================================== */
.woocommerce ul.products li.product .woocommerce-image__wrapper{
  padding:var(--tv-card-inset) var(--tv-card-inset) 0;
  display:grid;
  place-items:center;
  aspect-ratio:var(--tv-img-ratio);
}
.woocommerce ul.products li.product .woocommerce-image__wrapper img{
  width:100%;
  height:100%;
  object-fit:contain;
}
@supports not (aspect-ratio:1 / 1){
  .woocommerce ul.products li.product .woocommerce-image__wrapper{min-height:240px}
  .woocommerce ul.products li.product .woocommerce-image__wrapper img{height:100%}
}

/* ===========================================================
   INFO (título, categorías)
   =========================================================== */
.woocommerce ul.products li.product .woocommerce-card__header{
  padding:var(--tv-card-inset);
  display:grid;
  row-gap:var(--tv-stack-gap);
  align-content:start;
  text-align:left;
}
.woocommerce ul.products li.product .product__categories{margin:0}
.woocommerce ul.products li.product .woocommerce-loop-product__title{margin:0}

/* ===========================================================
   PRECIOS
   =========================================================== */
.woocommerce ul.products li.product .price{
  line-height:1.25;
  font-weight:700;
  display:block;
  margin-top:0;
  font-size:var(--tv-price-ins-m);
}
.woocommerce ul.products li.product .price ins{
  font-size:var(--tv-price-ins-m);
  font-weight:700;
  text-decoration:none;
}
.woocommerce ul.products li.product .price del{
  font-size:var(--tv-price-del-m);
  opacity:.7;
  margin-right:.35em;
}
@media (min-width:1024px){
  .woocommerce ul.products li.product .price{font-size:var(--tv-price-ins-d)}
  .woocommerce ul.products li.product .price ins{font-size:var(--tv-price-ins-d)}
  .woocommerce ul.products li.product .price del{font-size:var(--tv-price-del-d)}
}

/* ===========================================================
   CTA (agregar al carrito)
   =========================================================== */
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product a.add_to_cart_button,
.woocommerce ul.products li.product a.ajax_add_to_cart,
.woocommerce ul.products li.product a.added_to_cart{
  position:absolute;
  left:var(--tv-card-inset);
  right:var(--tv-card-inset);
  bottom:var(--tv-card-inset);
  min-height:var(--tv-cta-h);
  border-radius:var(--tv-cta-radius)!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .2s ease,transform .2s ease;
  width:auto;
}
.woocommerce ul.products li.product:hover a.button,
.woocommerce ul.products li.product:hover a.add_to_cart_button,
.woocommerce ul.products li.product:hover a.ajax_add_to_cart,
.woocommerce ul.products li.product:hover a.added_to_cart{
  opacity:1;
  transform:translateY(0);
}
@media (hover:none),(max-width:767.98px){
  :root{--tv-cta-h:var(--tv-cta-h-m)}
  .woocommerce ul.products li.product a.button,
  .woocommerce ul.products li.product a.add_to_cart_button,
  .woocommerce ul.products li.product a.ajax_add_to_cart,
  .woocommerce ul.products li.product a.added_to_cart{
    opacity:1!important;
    transform:none!important;
    display:inline-flex!important;
    z-index:2;
  }
}

/* ===========================================================
   VALORACIONES
   (oculta las nativas y mantiene compatibilidad con Site Reviews)
   =========================================================== */
.woocommerce ul.products li.product .star-rating{display:none!important}
.woocommerce ul.products li.product .glsrw-loop-rating,
.woocommerce ul.products li.product .glsr .glsr-star-rating{
  display:inline-flex!important;
  align-items:center;
  justify-content:flex-start;
  gap:.35em;
  margin:0!important;
  text-align:left!important;
  line-height:1;
}
.woocommerce ul.products li.product .glsrw-loop-rating .glsr-stars,
.woocommerce ul.products li.product .glsr .glsr-star-rating .glsr-stars{
  font-size:var(--tv-stars-size-m)!important;
  line-height:1;
  height:1em;
}
.woocommerce ul.products li.product .glsrw-loop-rating .glsr-star,
.woocommerce ul.products li.product .glsr .glsr-star-rating .glsr-star{
  width:1em;
  height:1em;
  display:inline-block;
  background-size:contain;
  background-repeat:no-repeat;
}
.woocommerce ul.products li.product .glsrw-loop-rating .glsr-star svg,
.woocommerce ul.products li.product .glsr .glsr-star-rating .glsr-star svg{
  width:1em;
  height:1em;
  display:block;
}
@media (min-width:1024px){
  .woocommerce ul.products li.product .glsrw-loop-rating .glsr-stars,
  .woocommerce ul.products li.product .glsr .glsr-star-rating .glsr-stars{
    font-size:var(--tv-stars-size-d)!important;
  }
}

/* ===========================================================
   RESPONSIVE GRIDS
   =========================================================== */
@media (min-width:768px) and (max-width:1023.98px){
  .elementor .woocommerce>ul.products,
  .elementor .woocommerce ul.products,
  .archive.post-type-archive-product .columns-4>ul.products,
  .tax-product_cat .columns-4>ul.products,
  .woocommerce-page .site-main ul.products{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media (max-width:767.98px){
  .elementor .woocommerce>ul.products,
  .elementor .woocommerce ul.products,
  .archive.post-type-archive-product .columns-4>ul.products,
  .tax-product_cat .columns-4>ul.products,
  .woocommerce-page .site-main ul.products{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:20px!important;
    max-width:none;
    margin:0!important;
  }
  .archive.post-type-archive-product .site-content .col-full,
  .tax-product_cat .site-content .col-full{
    padding-left:var(--tv-edge-m)!important;
    padding-right:var(--tv-edge-m)!important;
    box-sizing:border-box;
  }
  .archive.post-type-archive-product .content-area,
  .tax-product_cat .content-area,
  .archive.post-type-archive-product .site-main,
  .tax-product_cat .site-main{
    padding-left:0!important;
    padding-right:0!important;
  }
  .woocommerce ul.products li.product .woocommerce-loop-product__title{
    line-height:1.3!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    overflow:hidden!important;
    white-space:normal!important;
    max-height:calc(2 * 1.3em + 3px)!important;
    text-overflow:ellipsis!important;
    padding-bottom:3px!important;
  }
}

/* ===========================================================
   BLOQUE RELACIONADOS PERSONALIZADO - TigoVape
   =========================================================== */
.tv-relacionados{
  margin-top:24px;
  background:#F7F8F9;
  padding-top:16px;
  padding-bottom:16px;
  border-radius:12px;
}
.tv-relacionados-titulo{
  font-size:1.6rem;
  font-weight:600;
  margin:0 0 24px;
  text-align:center;
}
.tv-grid.products{
  display:grid!important;
  grid-template-columns:repeat(auto-fill, minmax(220px,1fr));
  gap:var(--tv-card-gap,28px);
  margin:0;
  padding:0;
  list-style:none;
}
@media (max-width:768px){
  .tv-relacionados-titulo{font-size:1.3rem}
  .tv-grid.products{
    grid-template-columns:repeat(auto-fill, minmax(150px,1fr));
    gap:18px;
  }
}

/* --- Desktop full-bleed aplicado al WRAPPER (solo producto) --- */
@media (min-width:1025px){
  .related-wrapper{
    padding-left:0!important;
    padding-right:0!important;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    background:#F7F8F9;
    padding-top:0!important;     /* compacto arriba */
    padding-bottom:40px;
  }
  .related-wrapper .tv-relacionados{
    background:transparent;
    border-radius:0;
    margin-top:-10px;            /* compacto respecto al bloque anterior */
    padding-top:0;
    padding-bottom:0;
  }
  .tv-relacionados>.tv-relacionados-titulo,
  .tv-relacionados>.tv-grid{
    max-width:var(--tv-grid-max,1190px);
    margin-left:auto;
    margin-right:auto;
    padding-left:var(--tv-edge-m,16px);
    padding-right:var(--tv-edge-m,16px);
  }
  .tv-relacionados-titulo{margin-bottom:28px}
}

/* Espaciado lateral del bloque de relacionados (solo móvil/tablet) */
@media (max-width: 1024px){
  .related-wrapper .tv-relacionados{
    padding-left: var(--tv-edge-m, 16px);
    padding-right: var(--tv-edge-m, 16px);
    box-sizing: border-box;
  }
}