/*
 * Enforce aspect ratio and object-fit for WooCommerce product images on archive pages.
 * Place this file in the woocommerce-optimizations folder and enqueue it from your theme or plugin if needed.
 */
/* Fix CLS for WooCommerce Product Images in Elementor */
.woocommerce ul.products li.product .woocommerce-loop-product__link img {
  aspect-ratio: 1 / 1; /* Creates a perfect square box */
  width: 100%; /* Ensure width is set */
  height: auto; /* Ensures the image scales correctly within the box */
  object-fit: contain;
}

/* Also target placeholder images */
.woocommerce ul.products li.product a img.woocommerce-placeholder,
.woocommerce-placeholder {
    aspect-ratio: 1 / 1;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Prevent layout shift from the FacetWP filter container */
#my-scroll-target {
    min-height: 80px; /* Adjust this number up or down to match the final height of your filter area */
}
