/*
 Theme Name:   Divi Child
 Theme URI:    http://elegantthemes.com/
 Description:  Divi Child Theme
 Author:       ElegantThemes
 Author URI:   http://elegantthemes.com
 Template:     Divi
 Version:      0.1.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags: responsive-layout, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, featured-images, full-width-template, post-formats, rtl-language-support, theme-options, threaded-comments, translation-ready
 Text Domain:  divi-child-theme
*/

/* ==== Add your own styles below this line ====
 * -------------------------------------------- */

 /* 1) Make a square stage for product images (archive + Divi shop module) */
.woocommerce ul.products li.product .et_shop_image,
.et_pb_shop .woocommerce ul.products li.product .et_shop_image {
  aspect-ratio: 1 / 1;           /* the square */
  width: 100%;
  display: grid;
  place-items: center;           /* perfect centering */
  background: #fff;              /* optional, matches card */
  overflow: visible;             /* don't clip badges like “3 YEAR WARRANTY” */
}

/* 2) Fit every image inside the square without cropping */
.woocommerce ul.products li.product .et_shop_image img,
.et_pb_shop .woocommerce ul.products li.product img {
  width: 100%;
  height: 100%;
  object-fit: contain;           /* key: preserve full image (no crop) */
}

/* (Optional) keep titles/prices aligned even if images vary */
.woocommerce ul.products li.product {
  display: flex;
  flex-direction: column;
}
.woocommerce ul.products li.product .et_shop_image { flex: 0 0 auto; }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price { margin-top: 0.75rem; }