/* Product detail gallery polish.
 * Keep navigation useful without covering the product photography.
 * Mobile is the priority: thumbnails already communicate image selection, so
 * the large floating dot pill is removed entirely below the desktop breakpoint.
 */
@media (max-width: 767px) {
  [data-testid="gallery-dots"] {
    display: none !important;
  }
}

/* On larger screens keep the dots available, but make the control visually
 * lighter so it obscures less of the image while preserving the existing
 * carousel behavior and accessible 44px tap targets. */
@media (min-width: 768px) {
  [data-testid="gallery-dots"] {
    bottom: 0.5rem !important;
    background: rgb(255 255 255 / 0.72) !important;
    box-shadow: 0 1px 6px rgb(15 23 42 / 0.08) !important;
    backdrop-filter: blur(6px);
  }
}