/* ============================================================
 * europet-product.css
 * Europet modular CSS
 * ============================================================ */

/* === Recomendados PDP === */
/* =========================
   Recomendados Europet (PDP)
   ========================= */
.europet-recs { margin: 2.5rem 0; }
.europet-recs-title { font-size: 22px; font-weight: 700; margin: 0 0 4px; }
.europet-recs-subtitle { margin: 0 0 16px; opacity: .8; }

/* --- Grid forzado: 4 / 3 / 2 columnas --- */
.europet-recs-grid{
  display: flex !important;
  flex-wrap: wrap;
  gap: 16px;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* hijos directos del UL (cubre li.product, e incluso plantillas que usen .product-small/.col) */
.europet-recs-grid > li,
.europet-recs-grid > li.product,
.europet-recs-grid > .product,
.europet-recs-grid > .product-small,
.europet-recs-grid > .col{
  flex: 0 0 calc(25% - 12px);
}

/* 3 columnas en tablet */
@media (max-width: 1024px){
  .europet-recs-grid > li,
  .europet-recs-grid > li.product,
  .europet-recs-grid > .product,
  .europet-recs-grid > .product-small,
  .europet-recs-grid > .col{
    flex-basis: calc(33.333% - 11px);
  }
}

/* 2 columnas en móvil */
@media (max-width: 640px){
  .europet-recs-grid > li,
  .europet-recs-grid > li.product,
  .europet-recs-grid > .product,
  .europet-recs-grid > .product-small,
  .europet-recs-grid > .col{
    flex-basis: calc(50% - 8px);
  }
}

/* Limitar altura de imagen y evitar “gigantes” */
.europet-recs ul.products .box-image{ max-height: 220px; }
.europet-recs ul.products .box-image img{
  width: auto !important;
  height: auto !important;
  max-height: 200px !important;
  object-fit: contain !important;
}

/* === Descripción producto desde CSS adicional === */
/* =========================
   Ajustes que estaban en "CSS adicional"
   ========================= */
.woocommerce-Tabs-panel--description h5 {
  font-weight: bold;
  margin-top: 25px;
  margin-bottom: 15px;
  color: #785aac;
}
.woocommerce-Tabs-panel--description p,
.woocommerce-Tabs-panel--description li { text-align: justify; }

/* === FAQ producto === */
/* Europet — FAQ (no colapsable) */
.europet-faq-list{ display:grid; gap:.6rem; }
.europet-faq-item{ border:1px solid #eee; border-radius:10px; padding:.75rem 1rem; background:#fff; }
.europet-faq-q{ margin:0 0 .35rem; font-weight:700; line-height:1.35; }
.europet-faq-a{ margin:0; opacity:.95; }

/* === Beneficios PDP === */
/* Europet — Bloque de beneficios bajo botón en ficha de producto */
.europet-pdp-benefits {
  margin-top: 1rem;
  padding: 1rem 1.25rem;
  border-radius: 12px;
  border: 1px solid #e7e7e7;
  background-color: #ffffff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
  font-size: 0.9rem;
  line-height: 1.5;
}
.europet-pdp-benefits-title {
  font-weight: 600;
  margin: 0 0 0.5rem 0;
}
.europet-pdp-benefits-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.europet-pdp-benefits-list li {
  margin-bottom: 0.25rem;
  position: relative;
  padding-left: 1.1rem;
}
.europet-pdp-benefits-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
}

/* === Ajustes página producto === */
/* =========================================================
   Europet - Ajustes página de producto
   ========================================================= */

/* 1) Ocultar breadcrumb en TODA la ficha */
.single-product .woocommerce-breadcrumb {
  display: none;
}

/* 2) Ajustes específicos para MÓVIL */
@media (max-width: 768px) {
  .single-product .product-summary img {
    display: none;
  }

  .single-product .woocommerce-tabs,
  .single-product .wc-tabs-wrapper {
    margin-top: 1rem;
  }
}

/* === Badge stock PDP === */
/* Europet — Badge de stock en PDP */
.single-product .product .stock,
.single-product .woocommerce-variation-availability .stock {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.25rem 0.9rem;
  border-radius: 999px;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  margin-top: 0.25rem;
}

/* Puntito de estado antes del texto */
.single-product .product .stock::before,
.single-product .woocommerce-variation-availability .stock::before {
  content: "";
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.8;
}

/* En stock */
.single-product .product .stock.in-stock,
.single-product .woocommerce-variation-availability .stock.in-stock {
  background: #e6f6ec;
  color: #147b3a;
}

/* Agotado */
.single-product .product .stock.out-of-stock,
.single-product .woocommerce-variation-availability .stock.out-of-stock {
  background: #fdeaea;
  color: #b3261e;
}

/* A pedido / backorder */
.single-product .product .stock.on-backorder,
.single-product .woocommerce-variation-availability .stock.on-backorder {
  background: #fff7e0;
  color: #b26a00;
}