/* Allow product grid items to shrink below their images' intrinsic width. */
.product-detail > .gallery,
.product-detail > .product-info {
  min-width: 0;
  max-width: 100%;
}

.main-product-image {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.main-product-image > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.thumbnails {
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 6px;
  overscroll-behavior-x: contain;
}

.thumbnails button {
  flex: 0 0 75px;
  min-width: 0;
  height: 75px;
}

.product-page .breadcrumb > *,
.product-info h1,
.product-info p {
  min-width: 0;
  overflow-wrap: anywhere;
}

.product-info select {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 600px) {
  .product-detail { grid-template-columns: minmax(0, 1fr); }
  .thumbnails button { flex-basis: 64px; width: 64px; height: 64px; }
}