/* Conservative, format-independent mobile image fitting. */
@media (max-width: 767px) {
  html body .product-miniature .product-miniature__top,
  html body .product-miniature .product-miniature__image-container {
    height: min(320px, calc(100vw - 70px)) !important;
    min-height: 260px !important;
    max-height: 320px !important;
  }
  html body .product-miniature .product-miniature__image-link,
  html body .product-miniature .product-miniature__media,
  html body#product .product__images .product__carousel .carousel-inner,
  html body#product .product__images .product__carousel .carousel-item,
  html body#product .product__images .product__carousel .carousel-item picture,
  html body .product-images-modal .carousel-inner,
  html body .product-images-modal .carousel-item,
  html body .product-images-modal .carousel-item picture { overflow: hidden !important; }
  html body .product-miniature .product-miniature__image-link,
  html body .product-miniature .product-miniature__media,
  html body#product .product__images .product__carousel .carousel-item picture,
  html body .product-images-modal .carousel-item picture {
    display: flex !important; align-items: center !important; justify-content: center !important;
    width: 100% !important; height: 100% !important; min-width: 0 !important; min-height: 0 !important; max-width: 100% !important; max-height: 100% !important;
  }
  html body .product-miniature[data-id-product] .product-miniature__image,
  html body#product .product__images .product__carousel .carousel-item img,
  html body .product-images-modal .carousel-item img {
    display: block !important; width: 100% !important; height: 100% !important; min-width: 0 !important; min-height: 0 !important; max-width: 100% !important; max-height: 100% !important;
    object-fit: contain !important; object-position: center !important;
    transform: translate(var(--ullm-fit-x, 0px), var(--ullm-fit-y, 0px)) scale(var(--ullm-fit-scale, 1)) !important;
    transform-origin: center center !important;
  }
  html body .product-images-modal .carousel-inner { height: min(72vh, calc(100vw - 32px)) !important; min-height: 300px !important; }
  html body .product-images-modal .modal-content { width: 100% !important; }
}