/* ============================================================
   Dunlop — Mejoras UX/UI globales (aplican a TODOS los productos,
   presentes y futuros). No editar productos uno por uno.
   ============================================================ */
:root{
  --dl-lima:#c4d600;      /* verde lima Dunlop */
  --dl-lima-d:#aebd00;    /* lima oscuro (hover) */
  --dl-ink:#111418;       /* negro texto */
  --dl-line:#e6e8eb;      /* bordes */
  --dl-soft:#f6f7f8;      /* fondo imagen */
  --dl-radius:14px;
  --dl-shadow:0 1px 2px rgba(17,20,24,.06);
  --dl-shadow-h:0 12px 28px rgba(17,20,24,.14);
}

/* ---------- 1. GRID DE PRODUCTOS: tarjetas uniformes ---------- */
.woocommerce ul.products li.product{
  display:flex !important;
  flex-direction:column;
  height:100%;
  background:#fff;
  border:1px solid var(--dl-line);
  border-radius:var(--dl-radius);
  padding:14px 14px 16px;
  box-shadow:var(--dl-shadow);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  overflow:hidden;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);
  box-shadow:var(--dl-shadow-h);
  border-color:#d7dade;
}

/* Caja de imagen consistente (mismo encuadre y fondo para todos) */
.woocommerce ul.products li.product > a:first-child,
.woocommerce ul.products li.product .brxe-image,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{
  display:block;
  background:var(--dl-soft);
  border-radius:10px;
  overflow:hidden;
}
.woocommerce ul.products li.product img{
  aspect-ratio:1/1;
  width:100%;
  height:auto;
  object-fit:contain;
  padding:14px;
  background:var(--dl-soft);
  border-radius:10px;
  transition:transform .25s ease;
}
.woocommerce ul.products li.product:hover img{ transform:scale(1.04); }

/* Título: 2 líneas máximo, altura reservada para alinear precios/botones */
.woocommerce ul.products li.product h5,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title{
  font-size:14px;
  line-height:1.35;
  margin:12px 0 6px;
  min-height:2.7em;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.woocommerce ul.products li.product h5 a{ color:var(--dl-ink); text-decoration:none; }

/* Precio */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .woocommerce-Price-amount{
  font-weight:800;
  color:var(--dl-ink);
  font-size:15px;
}

/* ---------- 2. MONEDA: mostrar MXN en todos los precios ---------- */
.woocommerce-Price-amount.amount::after{
  content:" MXN";
  font-size:.62em;
  font-weight:600;
  color:#6b7280;
  letter-spacing:.3px;
}

/* ---------- 3. BOTÓN PRIMARIO ÚNICO (tienda, relacionados, ficha) ---------- */
.woocommerce a.button.add_to_cart_button,
.woocommerce ul.products li.product .button,
.woocommerce .single_add_to_cart_button,
.woocommerce a.button.alt,
.woocommerce button.button.alt{
  margin-top:auto;                 /* empuja el botón al fondo de la tarjeta */
  display:block;
  width:100%;
  text-align:center;
  background:var(--dl-lima) !important;
  color:var(--dl-ink) !important;
  font-weight:800 !important;
  letter-spacing:.3px;
  text-transform:uppercase;
  border:2px solid var(--dl-lima) !important;
  border-radius:10px;
  padding:12px 16px !important;
  box-shadow:none !important;
  transition:background .16s ease, border-color .16s ease, transform .12s ease;
}
.woocommerce a.button.add_to_cart_button:hover,
.woocommerce ul.products li.product .button:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover{
  background:var(--dl-ink) !important;
  color:var(--dl-lima) !important;
  border-color:var(--dl-ink) !important;
  transform:translateY(-1px);
}
.woocommerce a.button.added::after{ content:" ✓"; }

/* ---------- 4. ACCESIBILIDAD: foco visible en todo el sitio ---------- */
a:focus-visible,
button:focus-visible,
.button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid var(--dl-ink) !important;
  outline-offset:2px !important;
  border-radius:4px;
}

/* ---------- 5. FICHA DE PRODUCTO: correcciones globales ---------- */
/* Ocultar el meta "SKU:" cuando el producto no tiene SKU (elemento Bricks) */
.brxe-product-meta .item:has(.sku:empty){ display:none; }
.woocommerce .product_meta .sku_wrapper:has(.sku:empty){ display:none; }

/* Estrellas: ocultar el placeholder "0 de 5" engañoso cuando no hay reseñas.
   Los productos CON reseñas siguen mostrando sus estrellas reales. */
.star-rating[aria-label="Valorado con 0 de 5"],
.star-rating[aria-label="Rated 0 out of 5"]{ display:none; }

/* Galería: fondo homogéneo en imagen principal y miniaturas */
.woocommerce div.product .woocommerce-product-gallery__image img{
  background:#fff; object-fit:contain;
}
.woocommerce div.product .flex-control-thumbs li img,
.woocommerce div.product .woocommerce-product-gallery__wrapper img{
  background:#fff;
}

/* Tabla de especificaciones más legible */
.woocommerce div.product .woocommerce-Tabs-panel table,
.woocommerce div.product table.shop_attributes{
  border-collapse:collapse; width:100%;
}
.woocommerce div.product table.shop_attributes th,
.woocommerce div.product table.shop_attributes td{
  padding:8px 10px; border-bottom:1px solid var(--dl-line);
}

/* ---------- 6. MICRO-DETALLES ---------- */
/* Carrito: contador y toque suave en iconos del header */
.woocommerce .cart-contents .count{ background:var(--dl-lima); color:var(--dl-ink); }

/* Enlaces de categoría / breadcrumb */
.woocommerce .woocommerce-breadcrumb a{ color:#6b7280; }
.woocommerce .woocommerce-breadcrumb a:hover{ color:var(--dl-ink); }

/* ============================================================
   RONDA 2 — Tienda y ficha más amigables
   ============================================================ */

/* Botón: icono de carrito + centrado flex */
.woocommerce a.button.add_to_cart_button,
.woocommerce ul.products li.product .button,
.woocommerce .single_add_to_cart_button{
  display:flex; align-items:center; justify-content:center; gap:9px;
}
.woocommerce a.button.add_to_cart_button::before,
.woocommerce ul.products li.product .button::before,
.woocommerce .single_add_to_cart_button::before{
  content:"";
  width:18px; height:18px; flex:0 0 18px;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'/%3E%3Ccircle cx='20' cy='21' r='1'/%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'/%3E%3Ccircle cx='20' cy='21' r='1'/%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Imagen de tarjeta con fondo "estudio" más cálido */
.woocommerce ul.products li.product img{
  background:linear-gradient(180deg,#ffffff 0%,#f4f5f6 100%);
}

/* ---------- Ficha: área de compra como tarjeta ---------- */
.woocommerce div.product form.cart,
.woocommerce div.product .brxe-woocommerce-product-add-to-cart{
  background:#fff;
  border:1px solid var(--dl-line);
  border-radius:14px;
  padding:16px;
  box-shadow:var(--dl-shadow);
}
/* Selector de cantidad */
.woocommerce .quantity input.qty,
.woocommerce div.product .quantity input.qty{
  border:1px solid var(--dl-line);
  border-radius:8px;
  padding:10px;
  font-weight:700;
}

/* ---------- Bloque de confianza (inyectado por JS) ---------- */
.dl-trust{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 14px;
  margin-top:16px;
  padding:14px 16px;
  background:var(--dl-soft);
  border:1px solid var(--dl-line);
  border-radius:12px;
}
.dl-trust__item{
  display:flex; align-items:center; gap:10px;
  font-size:13px; font-weight:600; color:#374151;
}
.dl-trust__i{
  font-size:18px; line-height:1;
  width:34px; height:34px; flex:0 0 34px;
  display:flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid var(--dl-line); border-radius:9px;
}

/* ---------- Buscador más amigable ---------- */
.brxe-search .bricks-search-inner input[type="search"],
.woocommerce .brxe-search input[type="search"]{
  border:1px solid var(--dl-line) !important;
  border-radius:999px !important;
  padding:10px 16px !important;
  background:#fff !important;
}
.brxe-search .bricks-search-inner input[type="search"]:focus{
  border-color:var(--dl-ink) !important;
}

/* ---------- Barra promo superior más suave ---------- */
.brxe-woocommerce-products,
body{ --dl-nothing:0; }

/* ---------- Título de sección: menos "grito" ---------- */
.woocommerce div.product h2,
.woocommerce div.product h3{ letter-spacing:.2px; }

/* ---------- Controles nativos de categoría (count + orderby) ---------- */
.woocommerce .woocommerce-result-count{
  font-weight:700; color:var(--dl-ink); font-size:14px; margin:0 0 14px;
}
.woocommerce .woocommerce-ordering select,
.woocommerce select.orderby{
  border:1px solid var(--dl-line); border-radius:9px;
  padding:9px 12px; font-weight:600; color:var(--dl-ink);
  background:#fff; cursor:pointer;
}
.woocommerce .woocommerce-ordering{ margin-bottom:14px; }

/* ---------- Barra de tienda (ordenar) ---------- */
.dl-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:14px; flex-wrap:wrap;
  margin:0 0 18px; padding:12px 16px;
  background:#fff; border:1px solid var(--dl-line); border-radius:12px;
  box-shadow:var(--dl-shadow);
}
.dl-toolbar__count{ font-weight:700; color:var(--dl-ink); font-size:14px; }
.dl-toolbar__sort{ font-size:13px; color:#6b7280; display:flex; align-items:center; gap:8px; }
.dl-toolbar__sort select{
  border:1px solid var(--dl-line); border-radius:9px;
  padding:9px 12px; font-weight:600; color:var(--dl-ink);
  background:#fff; cursor:pointer;
}
.dl-toolbar__sort select:hover{ border-color:var(--dl-ink); }

/* ---------- Responsive: trust en una columna en móvil ---------- */
@media (max-width:600px){
  .dl-trust{ grid-template-columns:1fr; }
  .woocommerce ul.products li.product h5{ min-height:0; }
  .dl-toolbar{ flex-direction:column; align-items:stretch; }
  .dl-toolbar__sort{ justify-content:space-between; }
}