/* Canonical storefront product grids -------------------------------------
   Full-width product collections share one responsive geometry:
   2 columns mobile -> 3 tablet -> 5 desktop.

   Catalogue pages with the facet sidebar are the one deliberate exception:
   the master grid stays five tracks total (1 filter + 4 product cards).

   PHP Woo loops already render our .product-card component. Woo Blocks use a
   separate DOM, so this file adapts only collections normalized to five columns.
   Deliberate two/three-column Woo blocks (for example Cart cross-sells) retain
   their own layout instead of being stretched into an empty five-track grid. */

/* Classic Woo/PHP product loops ------------------------------------------ */
@media (min-width: 1200px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .single-product-related__grid,
  .single-product-related .products,
  .single-product-related__skeleton {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  /* A filter rail is a real fifth track, not a four-column legacy layout. */
  .catalog-workspace.has-sidebar-tools .catalog-main .woocommerce ul.products,
  .woocommerce .catalog-workspace.has-sidebar-tools .catalog-main ul.products,
  .woocommerce-page .catalog-workspace.has-sidebar-tools .catalog-main ul.products {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* Legacy Woo product blocks: product-new, best sellers, on-sale, etc. ----- */
.wc-block-grid.has-5-columns .wc-block-grid__products {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 3px;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

.wc-block-grid.has-5-columns .wc-block-grid__product {
  display: flex !important;
  flex-direction: column;
  min-width: 0;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 6px !important;
  border: 0 !important;
  border-radius: var(--batya-radius-card);
  background: var(--batya-card);
  color: var(--batya-text);
  text-align: left !important;
  box-shadow: none;
}

.wc-block-grid.has-5-columns .wc-block-grid__product-image {
  display: block;
  width: 100%;
  margin: 0 0 6px !important;
  overflow: hidden;
  border-radius: var(--batya-radius-control);
  aspect-ratio: var(--batya-product-media-ratio);
  background: var(--batya-card);
}

.wc-block-grid.has-5-columns .wc-block-grid__product-image img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: contain;
  object-position: center;
  background: var(--batya-card);
}

.wc-block-grid.has-5-columns .wc-block-grid__product-title {
  display: -webkit-box;
  min-height: 0;
  margin: 0 0 6px !important;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  color: var(--batya-text);
  font-size: var(--batya-font-sm);
  font-weight: var(--batya-weight-medium);
  line-height: 1.35;
  text-align: left !important;
}

.wc-block-grid.has-5-columns .wc-block-grid__product-price {
  margin: auto 0 4px !important;
  color: var(--batya-text);
  font-size: var(--batya-font-base);
  font-weight: var(--batya-weight-semibold);
  line-height: 1.3;
  text-align: left !important;
}

.wc-block-grid.has-5-columns .wc-block-grid__product-price del {
  color: var(--batya-text-soft);
  opacity: .75;
}

/* Rating stars are not part of the current catalogue-card pattern. Product
   ratings remain available on the product page/header and reviews. */
.wc-block-grid.has-5-columns .wc-block-grid__product-rating {
  display: none !important;
}

.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart {
  width: 100%;
  margin: 4px 0 0 !important;
}

.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart .wp-block-button,
.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart .button,
.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart a {
  width: 100%;
}

.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart .button,
.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--batya-control-compact);
  padding: 0 10px;
  border: 0;
  border-radius: var(--batya-radius-sm);
  background: var(--batya-brand);
  color: #fff !important;
  font-size: var(--batya-font-sm);
  font-weight: var(--batya-weight-semibold);
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}

.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart .button:hover,
.wc-block-grid.has-5-columns .wc-block-grid__product-add-to-cart a:hover {
  background: var(--batya-brand-dark);
}

/* Modern Product Collection / Product Template --------------------------- */
.wc-block-product-template.columns-5.wc-block-product-template {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px 3px !important;
}

.wc-block-product-template.columns-5.wc-block-product-template > li {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

.wc-block-product-template.columns-5 .wc-block-product {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  padding: 6px;
  overflow: hidden;
  border: 0;
  border-radius: var(--batya-radius-card);
  background: var(--batya-card);
  color: var(--batya-text);
  box-shadow: none;
}

.wc-block-product-template.columns-5 .wp-block-woocommerce-product-image,
.wc-block-product-template.columns-5 .wc-block-components-product-image {
  width: 100%;
  margin: 0 0 6px !important;
  overflow: hidden;
  border-radius: var(--batya-radius-control);
  aspect-ratio: var(--batya-product-media-ratio);
  background: var(--batya-card);
}

.wc-block-product-template.columns-5 .wp-block-woocommerce-product-image img,
.wc-block-product-template.columns-5 .wc-block-components-product-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: var(--batya-card);
}

.wc-block-product-template.columns-5 .wp-block-post-title,
.wc-block-product-template.columns-5 [class*="product-title"] {
  display: -webkit-box;
  margin: 0 0 6px !important;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  color: var(--batya-text);
  font-size: var(--batya-font-sm) !important;
  font-weight: var(--batya-weight-medium);
  line-height: 1.35 !important;
  text-align: left !important;
}

.wc-block-product-template.columns-5 .wp-block-woocommerce-product-price,
.wc-block-product-template.columns-5 .wc-block-components-product-price {
  margin: auto 0 4px !important;
  color: var(--batya-text);
  font-size: var(--batya-font-base) !important;
  font-weight: var(--batya-weight-semibold);
  line-height: 1.3;
  text-align: left !important;
}

.wc-block-product-template.columns-5 .wp-block-woocommerce-product-rating,
.wc-block-product-template.columns-5 .wc-block-components-product-rating {
  display: none !important;
}

.wc-block-product-template.columns-5 .wp-block-woocommerce-product-button,
.wc-block-product-template.columns-5 .wc-block-components-product-button {
  width: 100%;
  margin: 4px 0 0 !important;
  margin-top: auto !important;
  text-align: stretch !important;
}

.wc-block-product-template.columns-5 .wp-block-woocommerce-product-button .wp-block-button__link,
.wc-block-product-template.columns-5 .wp-block-woocommerce-product-button button,
.wc-block-product-template.columns-5 .wc-block-components-product-button__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: var(--batya-control-compact);
  padding: 0 10px;
  border: 0;
  border-radius: var(--batya-radius-sm);
  background: var(--batya-brand);
  color: #fff !important;
  font-size: var(--batya-font-sm);
  font-weight: var(--batya-weight-semibold);
  line-height: 1.2;
  text-decoration: none;
}

.wc-block-product-template.columns-5 .wp-block-woocommerce-product-button .wp-block-button__link:hover,
.wc-block-product-template.columns-5 .wp-block-woocommerce-product-button button:hover,
.wc-block-product-template.columns-5 .wc-block-components-product-button__button:hover {
  background: var(--batya-brand-dark);
}

@media (hover: hover) {
  .wc-block-grid.has-5-columns .wc-block-grid__product,
  .wc-block-product-template.columns-5 .wc-block-product {
    transition: box-shadow .18s ease, transform .18s ease;
  }

  .wc-block-grid.has-5-columns .wc-block-grid__product:hover,
  .wc-block-product-template.columns-5 .wc-block-product:hover {
    box-shadow: 0 8px 22px rgba(27, 24, 21, .045);
    transform: translateY(-1px);
  }
}

@media (min-width: 768px) {
  .wc-block-grid.has-5-columns .wc-block-grid__products,
  .wc-block-product-template.columns-5.wc-block-product-template {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

@media (min-width: 1200px) {
  .wc-block-grid.has-5-columns .wc-block-grid__products,
  .wc-block-product-template.columns-5.wc-block-product-template {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}