#product_main_image {
  cursor: zoom-in;
}

.thumbnail-container {
  margin-bottom: 3rem;
  /* mb-5 equivalent for desktop */
}

.thumbnail-container img {
  display: block;
  width: 100px;
  object-fit: cover;
  cursor: pointer;
  border-radius: 4px;
  transition: opacity 0.2s ease;
}

.thumbnail-container img:hover {
  opacity: 0.8;
}

/* Mobile-specific styles */

@media screen and (max-width: 768px) {
  .thumbnail-container {
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 0.5rem;
    margin-bottom: 0;
    /* Remove margin on mobile */
    scrollbar-gutter: stable;
  }
  .thumbnail-container img {
    width: auto;
    height: 74px;
  }
}

#productImageViewModal img.product-thumbnail {
  border-radius: 2rem;
  cursor: pointer;
  position: relative;
  z-index: 1;
}

#productImageViewModal .product-thumbnail-container {
  border: 2px solid transparent;
  border-radius: 0.35rem;
  transition: border-color 0.2s;
}

#productImageViewModal .product-thumbnail-container:hover {
  border-color: #000;
}