/* Product images must stay inside their frames regardless of source dimensions. */
.product-img {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

.product-img img {
  position: absolute !important;
  inset: 18px !important;
  display: block !important;
  width: calc(100% - 36px) !important;
  height: calc(100% - 36px) !important;
  max-width: calc(100% - 36px) !important;
  max-height: calc(100% - 36px) !important;
  object-fit: contain !important;
  object-position: center center !important;
}

.shop-detail {
  align-items: stretch !important;
}

.main-photo {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 575px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

.main-photo img {
  position: absolute !important;
  inset: 24px !important;
  display: block !important;
  width: calc(100% - 48px) !important;
  height: calc(100% - 48px) !important;
  max-width: calc(100% - 48px) !important;
  max-height: calc(100% - 48px) !important;
  object-fit: contain !important;
  object-position: center center !important;
}

@media (max-width: 900px) {
  .main-photo {
    height: min(78vw, 520px) !important;
  }
}

@media (max-width: 560px) {
  .product-img img {
    inset: 12px !important;
    width: calc(100% - 24px) !important;
    height: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    max-height: calc(100% - 24px) !important;
  }

  .main-photo {
    height: 92vw !important;
    max-height: 470px !important;
  }

  .main-photo img {
    inset: 16px !important;
    width: calc(100% - 32px) !important;
    height: calc(100% - 32px) !important;
    max-width: calc(100% - 32px) !important;
    max-height: calc(100% - 32px) !important;
  }
}