/* Classic WooCommerce and Elementor classic product lists.
 * :where() keeps specificity below Elementor widget controls.
 */
:where(.woocommerce ul.products li.product) { background: var(--hfc-paper); border-radius: var(--hfc-radius); overflow-wrap: anywhere; }
/* Match Woo's default selector weight; Elementor widget selectors still win. */
.woocommerce ul.products li.product a img {
  aspect-ratio: 3 / 4; object-fit: cover; width: 100%; height: auto;
  border-radius: var(--hfc-radius); background: var(--hfc-soft);
}
:where(.woocommerce ul.products li.product .woocommerce-loop-product__title) { font-family: var(--hfc-font-body); font-size: 1rem; font-weight: 500; line-height: 1.5; }
.woocommerce :where(ul.products li.product .price, div.product p.price, div.product span.price) { color: var(--hfc-ink); }
:where(.woocommerce ul.products li.product .price del) { color: var(--hfc-muted); }
:where(.woocommerce ul.products li.product .price ins) { text-decoration: none; }
.woocommerce :where(a.button, button.button, input.button, #respond input#submit) {
  background: var(--hfc-accent); color: #fff; border: 1px solid transparent;
  border-radius: var(--hfc-radius); min-height: 44px; padding: 12px 20px;
  font-weight: 500; line-height: 1.35; text-align: center;
}
.woocommerce :where(a.button:hover, button.button:hover, input.button:hover) { background: var(--hfc-accent-hover); color: #fff; }
/* WooCommerce alternate button selectors require explicit overrides. */
.woocommerce :where(a, button, input).button.alt { background-color: var(--hfc-accent); color: #fff; }
.woocommerce :where(a, button, input).button.alt:hover { background-color: var(--hfc-accent-hover); color: #fff; }
.woocommerce :where(a, button, input).button:disabled { opacity: .55; cursor: not-allowed; }
.woocommerce :where(span.onsale) { background: var(--hfc-accent); color: #fff; }
:where(.woocommerce div.product .product_title) { font-size: clamp(1.8rem, 3vw, 2.8rem); }
:where(.woocommerce div.product .woocommerce-product-details__short-description) { color: var(--hfc-muted); line-height: 1.8; }
:where(.woocommerce div.product .product_meta) { border-top: 1px solid var(--hfc-border); padding-top: 20px; font-size: .875rem; }
:where(.woocommerce div.product .product_meta > span) { display: block; margin-block: 6px; }
:where(.woocommerce div.product form.cart .variations select) { min-height: 44px; border: 1px solid var(--hfc-border); border-radius: var(--hfc-radius); padding: 8px 12px; max-width: 100%; }
:where(.woocommerce .quantity .qty) { min-height: 44px; border: 1px solid var(--hfc-border); border-radius: var(--hfc-radius); }
:where(.woocommerce div.product .woocommerce-tabs .panel) { line-height: 1.8; }
/* Gallery stays uncropped; WooCommerce owns zoom, lightbox and slider behavior. */
:where(.woocommerce div.product div.images img) { border-radius: var(--hfc-radius); }
/* Modern product blocks: preserve their configured grid/column layout. */
:where(.wc-block-product-template .wc-block-components-product-image img) { aspect-ratio: 3 / 4; object-fit: cover; }
@media (max-width: 767px) {
  :where(.woocommerce ul.products li.product .woocommerce-loop-product__title) { font-size: .9375rem; }
  :where(.woocommerce ul.products li.product .button) { padding-inline: 10px; max-width: 100%; white-space: normal; }
  :where(.woocommerce div.product form.cart) { margin-bottom: 24px; }
  :where(.woocommerce div.product .woocommerce-tabs ul.tabs) { overflow-x: auto; }
}
/* Core provides responsive product columns and single-product stacking.
 * Do not override those grids globally: Elementor and blocks own their columns.
 */
