.product-detail-page {
  width: 100%;
}

.product-gallery-card,
.product-summary-card,
.product-price-card,
.product-cart-card {
  background: #fff;
  border: 1px solid var(--shop-border);
  border-radius: 6px;
  padding: 1rem;
}

.product-summary-card,
.product-price-card {
  margin-bottom: 1rem;
}

.product-carousel {
  width: 100%;
}

.product-carousel .carousel-inner {
  background: #fff;
  border-radius: 4px;
}

.product-carousel .carousel-item {
  height: clamp(320px, 48vw, 620px);
}

.product-carousel-image {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
}

.product-carousel .carousel-control-prev,
.product-carousel .carousel-control-next {
  width: 3rem;
}

.product-carousel .carousel-control-prev-icon,
.product-carousel .carousel-control-next-icon {
  background-color: rgba(17, 24, 39, .65);
  border-radius: 999px;
  background-size: 55%;
}

.product-thumbnail-strip {
  display: flex;
  gap: .65rem;
  margin-top: 1rem;
  overflow-x: auto;
  padding: .25rem .125rem .5rem;
}

.product-thumbnail {
  flex: 0 0 74px;
  width: 74px;
  aspect-ratio: 1;
  padding: 3px;
  background: #fff;
  border: 1px solid var(--shop-border);
  border-radius: 4px;
}

.product-thumbnail.active,
.product-thumbnail:hover {
  border-color: var(--shop-orange);
  box-shadow: 0 0 0 2px rgba(255, 153, 0, .28);
}

.product-thumbnail img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
}

.product-image-placeholder {
  min-height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #565959;
  background: #f7fafa;
  border-radius: 4px;
}

.product-price-row + .product-price-row {
  border-top: 1px solid var(--shop-border);
  margin-top: .85rem;
  padding-top: .85rem;
}

@media (max-width: 767.98px) {
  .product-gallery-card,
  .product-summary-card,
  .product-price-card,
  .product-cart-card {
    padding: .875rem;
  }

  .product-carousel .carousel-item {
    height: 320px;
  }

  .product-thumbnail {
    flex-basis: 64px;
    width: 64px;
  }
}