/** Shopify CDN: Minification failed

Line 16:16 Unexpected "{"
Line 16:25 Expected ":"
Line 16:32 Unexpected "{"
Line 126:54 Unexpected "{"
Line 126:63 Expected ":"
Line 126:70 Unexpected "{"
Line 136:54 Unexpected "{"
Line 136:63 Expected ":"
Line 137:54 Unexpected "{"
Line 137:63 Expected ":"
... and 10 more hidden warnings

**/
#GalleryViewer-{{ section.id }} { position: relative; }

media-gallery[id^="MediaGallery-"] slider-component[id^="GalleryViewer-"] {
  position: relative;
}
media-gallery[id^="MediaGallery-"] .pmc__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 50;
}
media-gallery[id^="MediaGallery-"] .pmc__arrow--prev { left: 10px; }
media-gallery[id^="MediaGallery-"] .pmc__arrow--next { right: 10px; }

/* Soft background + rounded media viewport */
media-gallery[id^="MediaGallery-"] slider-component {
  border-radius: 14px;
  overflow: hidden;
}

/* Optional neutral backdrop behind media items */
media-gallery[id^="MediaGallery-"] .product__media-item {
  background: #f4f4f4;
}

media-gallery[id^="MediaGallery-"] .pmc__arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  background: rgba(255, 255, 255, 0.35);      /* transparent fill */
  border: 0px solid rgba(255, 255, 255, 0.35);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);        /* Safari */
  width: 40px;
  height: 40px;
  cursor: pointer;
  border-radius: 999px;
}

media-gallery[id^="MediaGallery-"] .pmc__arrow:hover{
  background: rgba(199, 197, 228, 0.5);
}

media-gallery[id^="MediaGallery-"] .pmc__arrow--prev { left: 10px; }
media-gallery[id^="MediaGallery-"] .pmc__arrow--next { right: 10px; }

/* Make sure the arrows position relative to the viewer */
media-gallery[id^="MediaGallery-"] #GalleryViewer-1,
media-gallery[id^="MediaGallery-"] slider-component {
  position: relative;
}

/* Hide arrows on touch devices (keep swipe/grab) */
@media (pointer: coarse) {
  media-gallery[id^="MediaGallery-"] .pmc__arrow {
    display: none !important;
  }
}

/* When Dawn opens modal/lightbox, avoid overlay conflicts */
body.overflow-hidden media-gallery[id^="MediaGallery-"] .pmc__arrow,
body.modal-open media-gallery[id^="MediaGallery-"] .pmc__arrow,
body.no-scroll media-gallery[id^="MediaGallery-"] .pmc__arrow {
  display: none !important;
}

/* Rotate Dawn caret (default points down) */
media-gallery[id^="MediaGallery-"] .pmc__arrow .svg-wrapper,
media-gallery[id^="MediaGallery-"] .pmc__arrow svg {
  transform-origin: 50% 50%;
}

/* Left arrow */
media-gallery[id^="MediaGallery-"] .pmc__arrow--prev .svg-wrapper,
media-gallery[id^="MediaGallery-"] .pmc__arrow--prev svg {
  transform: rotate(90deg);
}

/* Right arrow */
media-gallery[id^="MediaGallery-"] .pmc__arrow--next .svg-wrapper,
media-gallery[id^="MediaGallery-"] .pmc__arrow--next svg {
  transform: rotate(-90deg);
}

media-gallery[id^="MediaGallery-"] .pmc__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3;          /* remove button padding */
  line-height: 0;      /* kill baseline/line-height offset */
}

/* Prevent the wrapper from adding baseline spacing */
media-gallery[id^="MediaGallery-"] .pmc__arrow .svg-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Ensure the SVG is visually centered */
media-gallery[id^="MediaGallery-"] .pmc__arrow svg {
  display: block;
}

media-gallery[id^="MediaGallery-"] .product__media-item {
  background: transparent !important;
}

@media screen and (max-width: 749px) {
  media-gallery[id^="MediaGallery-"] #Slider-Gallery-{{ section.id }} {
    background: transparent !important;
  }

  media-gallery[id^="MediaGallery-"] slider-component[id^="GalleryViewer-"] {
    background: transparent !important;
  }
}

@media screen and (max-width: 749px) {
  media-gallery[id^="MediaGallery-"] #Slider-Gallery-{{ section.id }} .global-media-settings,
  media-gallery[id^="MediaGallery-"] #Slider-Gallery-{{ section.id }} .product__media,
  media-gallery[id^="MediaGallery-"] #Slider-Gallery-{{ section.id }} .media,
  media-gallery[id^="MediaGallery-"] #Slider-Gallery-{{ section.id }} .deferred-media,
  media-gallery[id^="MediaGallery-"] #Slider-Gallery-{{ section.id }} img {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* If your media is inside a button/link, mobile tap styles can look like a border */
  media-gallery[id^="MediaGallery-"] #Slider-Gallery-{{ section.id }} button,
  media-gallery[id^="MediaGallery-"] #Slider-Gallery-{{ section.id }} a {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }
}


/* Rounded corners for the MAIN media (not thumbnails) */
media-gallery[id^="MediaGallery-"] slider-component[id^="GalleryViewer-"] {
  border-radius: 16px;
  border: 0px;
  overflow: hidden; /* critical: clips the media to rounded corners */
}

/* Round the MAIN viewer + clip everything inside */
media-gallery[id^="MediaGallery-"] slider-component[id^="GalleryViewer-"] {
  border-radius: 16px;
  overflow: hidden;
}

/* Clip the media wrapper(s) Dawn uses */
media-gallery[id^="MediaGallery-"] li[id^="Slide-"] .product__media,
media-gallery[id^="MediaGallery-"] li[id^="Slide-"] .media,
media-gallery[id^="MediaGallery-"] li[id^="Slide-"] .deferred-media,
media-gallery[id^="MediaGallery-"] li[id^="Slide-"] .global-media-settings {
  border-radius: 16px;
  overflow: hidden;
}

/* Round actual media elements */
media-gallery[id^="MediaGallery-"] li[id^="Slide-"] img,
media-gallery[id^="MediaGallery-"] li[id^="Slide-"] video,
media-gallery[id^="MediaGallery-"] li[id^="Slide-"] iframe,
media-gallery[id^="MediaGallery-"] li[id^="Slide-"] model-viewer {
  border-radius: 16px;
}