/*--------------------------------------------------------------
# WooCommerce + Bootstrap: rejilla de productos y categorías
# Las plantillas del tema (content-product.php, content-product-cat.php) pintan
# <ul class="row products"> con <li class="col-12 col-sm-6 col-md-4 col-lg-3 product">.
# Las reglas de WooCommerce (.woocommerce ul.products li.product { width: 22.05%; float... })
# son más específicas que las columnas de Bootstrap: aquí se devuelven los anchos de Bootstrap.
# Se carga siempre que WooCommerce está activo (tuenweb-woo/woo-functions.php), detrás de woocommerce.css.
--------------------------------------------------------------*/
/* La fila recupera sus márgenes negativos de Bootstrap (WooCommerce pone margin 0): alineada con el contenedor */
.woocommerce ul.products.row {
  margin-left: calc(var(--bs-gutter-x) * -.5);
  margin-right: calc(var(--bs-gutter-x) * -.5);
}
.woocommerce ul.products.row::before,
.woocommerce ul.products.row::after { display: none; }
.woocommerce ul.products.row > li.product[class*="col-"] {
  float: none; clear: none; margin-left: 0; margin-right: 0;
  padding-left: calc(var(--bs-gutter-x) * .5);  /* WooCommerce pone padding 0: se pierde el hueco entre columnas */
  padding-right: calc(var(--bs-gutter-x) * .5);
}
.woocommerce ul.products.row > li.product.col-1 { width: 8.33333%; }
.woocommerce ul.products.row > li.product.col-2 { width: 16.6667%; }
.woocommerce ul.products.row > li.product.col-3 { width: 25%; }
.woocommerce ul.products.row > li.product.col-4 { width: 33.3333%; }
.woocommerce ul.products.row > li.product.col-5 { width: 41.6667%; }
.woocommerce ul.products.row > li.product.col-6 { width: 50%; }
.woocommerce ul.products.row > li.product.col-7 { width: 58.3333%; }
.woocommerce ul.products.row > li.product.col-8 { width: 66.6667%; }
.woocommerce ul.products.row > li.product.col-9 { width: 75%; }
.woocommerce ul.products.row > li.product.col-10 { width: 83.3333%; }
.woocommerce ul.products.row > li.product.col-11 { width: 91.6667%; }
.woocommerce ul.products.row > li.product.col-12 { width: 100%; }
@media (min-width: 576px) {
  .woocommerce ul.products.row > li.product.col-sm-1 { width: 8.33333%; }
  .woocommerce ul.products.row > li.product.col-sm-2 { width: 16.6667%; }
  .woocommerce ul.products.row > li.product.col-sm-3 { width: 25%; }
  .woocommerce ul.products.row > li.product.col-sm-4 { width: 33.3333%; }
  .woocommerce ul.products.row > li.product.col-sm-5 { width: 41.6667%; }
  .woocommerce ul.products.row > li.product.col-sm-6 { width: 50%; }
  .woocommerce ul.products.row > li.product.col-sm-7 { width: 58.3333%; }
  .woocommerce ul.products.row > li.product.col-sm-8 { width: 66.6667%; }
  .woocommerce ul.products.row > li.product.col-sm-9 { width: 75%; }
  .woocommerce ul.products.row > li.product.col-sm-10 { width: 83.3333%; }
  .woocommerce ul.products.row > li.product.col-sm-11 { width: 91.6667%; }
  .woocommerce ul.products.row > li.product.col-sm-12 { width: 100%; }
}
@media (min-width: 768px) {
  .woocommerce ul.products.row > li.product.col-md-1 { width: 8.33333%; }
  .woocommerce ul.products.row > li.product.col-md-2 { width: 16.6667%; }
  .woocommerce ul.products.row > li.product.col-md-3 { width: 25%; }
  .woocommerce ul.products.row > li.product.col-md-4 { width: 33.3333%; }
  .woocommerce ul.products.row > li.product.col-md-5 { width: 41.6667%; }
  .woocommerce ul.products.row > li.product.col-md-6 { width: 50%; }
  .woocommerce ul.products.row > li.product.col-md-7 { width: 58.3333%; }
  .woocommerce ul.products.row > li.product.col-md-8 { width: 66.6667%; }
  .woocommerce ul.products.row > li.product.col-md-9 { width: 75%; }
  .woocommerce ul.products.row > li.product.col-md-10 { width: 83.3333%; }
  .woocommerce ul.products.row > li.product.col-md-11 { width: 91.6667%; }
  .woocommerce ul.products.row > li.product.col-md-12 { width: 100%; }
}
@media (min-width: 992px) {
  .woocommerce ul.products.row > li.product.col-lg-1 { width: 8.33333%; }
  .woocommerce ul.products.row > li.product.col-lg-2 { width: 16.6667%; }
  .woocommerce ul.products.row > li.product.col-lg-3 { width: 25%; }
  .woocommerce ul.products.row > li.product.col-lg-4 { width: 33.3333%; }
  .woocommerce ul.products.row > li.product.col-lg-5 { width: 41.6667%; }
  .woocommerce ul.products.row > li.product.col-lg-6 { width: 50%; }
  .woocommerce ul.products.row > li.product.col-lg-7 { width: 58.3333%; }
  .woocommerce ul.products.row > li.product.col-lg-8 { width: 66.6667%; }
  .woocommerce ul.products.row > li.product.col-lg-9 { width: 75%; }
  .woocommerce ul.products.row > li.product.col-lg-10 { width: 83.3333%; }
  .woocommerce ul.products.row > li.product.col-lg-11 { width: 91.6667%; }
  .woocommerce ul.products.row > li.product.col-lg-12 { width: 100%; }
}
@media (min-width: 1200px) {
  .woocommerce ul.products.row > li.product.col-xl-1 { width: 8.33333%; }
  .woocommerce ul.products.row > li.product.col-xl-2 { width: 16.6667%; }
  .woocommerce ul.products.row > li.product.col-xl-3 { width: 25%; }
  .woocommerce ul.products.row > li.product.col-xl-4 { width: 33.3333%; }
  .woocommerce ul.products.row > li.product.col-xl-5 { width: 41.6667%; }
  .woocommerce ul.products.row > li.product.col-xl-6 { width: 50%; }
  .woocommerce ul.products.row > li.product.col-xl-7 { width: 58.3333%; }
  .woocommerce ul.products.row > li.product.col-xl-8 { width: 66.6667%; }
  .woocommerce ul.products.row > li.product.col-xl-9 { width: 75%; }
  .woocommerce ul.products.row > li.product.col-xl-10 { width: 83.3333%; }
  .woocommerce ul.products.row > li.product.col-xl-11 { width: 91.6667%; }
  .woocommerce ul.products.row > li.product.col-xl-12 { width: 100%; }
}
@media (min-width: 1400px) {
  .woocommerce ul.products.row > li.product.col-xxl-1 { width: 8.33333%; }
  .woocommerce ul.products.row > li.product.col-xxl-2 { width: 16.6667%; }
  .woocommerce ul.products.row > li.product.col-xxl-3 { width: 25%; }
  .woocommerce ul.products.row > li.product.col-xxl-4 { width: 33.3333%; }
  .woocommerce ul.products.row > li.product.col-xxl-5 { width: 41.6667%; }
  .woocommerce ul.products.row > li.product.col-xxl-6 { width: 50%; }
  .woocommerce ul.products.row > li.product.col-xxl-7 { width: 58.3333%; }
  .woocommerce ul.products.row > li.product.col-xxl-8 { width: 66.6667%; }
  .woocommerce ul.products.row > li.product.col-xxl-9 { width: 75%; }
  .woocommerce ul.products.row > li.product.col-xxl-10 { width: 83.3333%; }
  .woocommerce ul.products.row > li.product.col-xxl-11 { width: 91.6667%; }
  .woocommerce ul.products.row > li.product.col-xxl-12 { width: 100%; }
}

/*--------------------------------------------------------------
# Ficha de producto (woocommerce/content-single-product.php)
# Galería y resumen ya van en columnas Bootstrap (col-sm-6): WooCommerce les daba además
# width: 48% y float, y quedaban a la mitad de su columna con un hueco en medio.
--------------------------------------------------------------*/
.woocommerce div.product.tuenweb-product div.images,
.woocommerce div.product.tuenweb-product div.summary {
  float: none;
  width: 100%;
}
