/* Extensión de .card para los carruseles de productos (Odoo).
   Reutiliza el mismo lenguaje visual (--radius, --blue, --bg, --muted,
   --shadow) que ya usa el resto del sitio; esto solo agrega lo que
   .card no tenía: imagen de producto, rating y el botón de carrito. */

.product-card{ padding:var(--space-4) var(--space-4) var(--space-5); }

.product-card-imgwrap{
  display:flex;
  align-items:center;
  justify-content:center;
  aspect-ratio:1/1;
  background:var(--bg);
  border-radius:calc(var(--radius) - 12px);
  overflow:hidden;
  margin-bottom:4px;
}
.product-card-imgwrap img{
  max-width:70%;
  max-height:70%;
  object-fit:contain;
}

.product-card h3{
  font-size:16px;
  line-height:1.3;
  letter-spacing:-.01em;
  max-width:none;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:42px;
}
.product-card h3 a{ color:inherit; text-decoration:none; }

.product-card-rating{
  display:flex;
  align-items:center;
  gap:2px;
}
.product-card-rating span{
  margin-left:4px;
  font-size:12px;
  color:var(--muted);
}

.product-card .price{
  font-size:18px;
  font-weight:700;
  color:var(--text);
}

.product-card-cta{
  margin-top:4px;
  width:100%;
  gap:8px;
  font-size:13px;
}

@media (max-width:640px){
  .product-card h3{ font-size:15px; }
}