/* ==========================================================================
   Canin — product card image fix  (DEMO / preview only)

   THE BUG
   Every product image box in the site is a grid container with a fixed
   aspect-ratio, and the <img> inside carries width:100%; height:100%.
   A grid item's default `min-height: auto` refuses to shrink the item below
   its own intrinsic size, so height:100% never takes effect: a 500x500 photo
   stays square even when its box is landscape. The box has overflow:hidden,
   so the extra height is silently cut off the bottom of the picture.

   Measured on the live site before this fix:
     shop card      box 201x165  ->  img 199x199  =  34px of the photo cut
     home card      box 172x129  ->  img 172x172  =  43px of the photo cut  (mobile)

   object-fit was never the cause — it already computed to `contain` in both
   places. It simply cannot help, because the element itself is larger than the
   frame that clips it.

   THE FIX
   Allow the image to shrink to its box (min-width/min-height: 0), then let
   object-fit: contain letterbox it. Nothing else changes: box sizes, aspect
   ratios, card heights and the rest of the design stay exactly as they are.
   ========================================================================== */

/* legacy card — products.php, vendor.php, similar products */
.product-image img,
/* redesigned card — homepage, shop and category demos */
.hm-card-media img {
    min-width: 0;
    min-height: 0;
    object-fit: contain;
}