/* TOPDON 1.2.7 · Un único sistema de tarjetas responsive para portada / tienda / categorías / relacionados / búsqueda.
   Sustituye ajustes contradictorios de 1.2.4 y 1.2.6. No toca los datos ni botones funcionales. */
:root {
  --td-list-gap:18px;
  --td-list-card-image:220px;
}

/* Usar los mismos anchos horizontales del contenedor de la portada; los "li.product" son exactamente los mismos componentes. */
/* Ancho útil idéntico al .wrap de portada: 1240px incluyendo 20px por lado. */
.topdon-wc-page .lp-container {
  width:100% !important;
  max-width:1200px !important;
  padding-inline:0 !important;
  box-sizing:border-box !important;
}
.topdon-wc-page .woocommerce ul.products,
.topdon-wc-archive .woocommerce ul.products,
.topdon-wc-single .woocommerce .related.products ul.products,
.topdon-wc-single .woocommerce .up-sells.products ul.products,
.topdon-wc-page .woocommerce ul.products.topdon-search-products {
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  align-items:stretch !important;
  column-gap:var(--td-list-gap) !important;
  row-gap:var(--td-list-gap) !important;
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding:0 !important;
  list-style:none !important;
}
.topdon-wc-page .woocommerce ul.products::before,
.topdon-wc-page .woocommerce ul.products::after{display:none !important;content:none !important;}
.topdon-wc-page .woocommerce ul.products > li.td-design-card,
.topdon-wc-page .woocommerce ul.products > li.product.td-design-card{
  display:flex !important;
  flex-direction:column !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  float:none !important;
  clear:none !important;
  grid-column:auto !important;
  box-sizing:border-box !important;
  align-self:stretch !important;
}
/* El carrusel es desplazable: mismas dimensiones visibles y misma separación que la rejilla. */
.topdon-carousel-section .td-product-carousel-track { gap:var(--td-list-gap) !important; align-items:stretch !important; }
.topdon-carousel-section .td-product-carousel-track > .td-design-card {height:auto !important;}

@media (max-width:1199px) and (min-width:901px){
  .topdon-wc-page .woocommerce ul.products,
  .topdon-wc-archive .woocommerce ul.products,
  .topdon-wc-single .woocommerce .related.products ul.products,
  .topdon-wc-single .woocommerce .up-sells.products ul.products,
  .topdon-wc-page .woocommerce ul.products.topdon-search-products {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* Tablets: 2 productos igual que el carrusel de inicio. */
@media (max-width:900px) and (min-width:768px){
  .topdon-wc-page .woocommerce ul.products,
  .topdon-wc-archive .woocommerce ul.products,
  .topdon-wc-single .woocommerce .related.products ul.products,
  .topdon-wc-single .woocommerce .up-sells.products ul.products,
  .topdon-wc-page .woocommerce ul.products.topdon-search-products {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
/* La misma geometría en un teléfono: dos tarjetas completas en ambos carruseles Y TODOS los listados. */
@media (max-width:767px){
  :root{--td-list-gap:12px;}
   .topdon-wc-archive, .topdon-wc-single{padding-left:18px !important;padding-right:18px !important;}
  .topdon-wc-page .lp-container{padding-inline:0 !important;}
  .topdon-wc-page .woocommerce ul.products,
  .topdon-wc-archive .woocommerce ul.products,
  .topdon-wc-single .woocommerce .related.products ul.products,
  .topdon-wc-single .woocommerce .up-sells.products ul.products,
  .topdon-wc-page .woocommerce ul.products.topdon-search-products{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    column-gap:12px !important;
    row-gap:16px !important;
  }
  .topdon-carousel-section .td-product-carousel-track{
    gap:12px !important;
    scroll-snap-type:x mandatory !important;
  }
  .topdon-carousel-section .td-product-carousel-track > .td-design-card{
    flex:0 0 calc((100% - 12px)/2) !important;
    width:calc((100% - 12px)/2) !important;
    min-width:0 !important;
    max-width:none !important;
    scroll-snap-align:start;
  }

  /* Una sola definición para imagen, badge, comparador, textos, precios y acciones. */
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .card-img {
    height:clamp(145px,42vw,184px) !important;
    min-height:clamp(145px,42vw,184px) !important;
  }
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .card-img > .td-card-image-link {
    padding:8px !important;
  }
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .card-badge {
    top:9px !important;left:9px !important;padding:4px 7px !important;
    font-size:9px !important;line-height:1.15 !important;
  }
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .td-compare-toggle {
    top:9px !important;right:9px !important;
    width:31px !important;height:31px !important;min-width:31px !important;
    padding:6px !important;border-radius:9px !important;
  }
  .td-design-card .td-compare-toggle svg {width:16px !important;height:16px !important;}
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .card-body {
    padding:12px 11px 14px !important;
    gap:7px !important;
  }
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .card-cat {
    color:#72d2fa !important;
    font-size:clamp(8px,2.1vw,9px) !important;
    line-height:1.45 !important;
    letter-spacing:.55px !important;
  }
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .card-title {
    font-size:clamp(13px,3.65vw,15px) !important;
    line-height:1.3 !important;
    letter-spacing:-.018em !important;
    text-align:left !important;
  }
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .card-prices {
    min-height:70px !important;
    flex-basis:70px !important;
    padding:8px 0 !important;
    gap:3px !important;
    margin-bottom:9px !important;
    justify-content:center !important;
    align-items:flex-start !important;
  }
  .td-design-card .card-prices .price-old-sm,
  .td-design-card .card-prices .price-old-sm .woocommerce-Price-amount {
    font-size:10px !important;
  }
  .td-design-card .card-prices .price-new-sm,
  .td-design-card .card-prices .price-new-sm .woocommerce-Price-amount {
    font-size:clamp(18px,5.05vw,22px) !important;
    line-height:1.12 !important;
  }
  :is(.product-grid > .td-design-card,.topdon-wc-page .woocommerce ul.products li.td-design-card) .card-actions {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:5px !important;
    margin-top:auto !important;
  }
  .td-design-card .card-actions > a.btn-card-cart,
  .td-design-card .card-actions > a.btn-card-quote,
  .td-design-card .card-actions .topdon-native-quote .add-request-quote-button,
  .td-design-card .card-actions .topdon-native-quote .topdon-quote-options {
    min-height:50px !important;
    height:100% !important;
    padding:7px 3px !important;
    border-radius:8px !important;
    font-size:clamp(9px,2.55vw,10px) !important;
    line-height:1.2 !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
  }
}