.ecpdp-gallery{
  --ecpdp-gallery-gap:8px;
  --ecpdp-gallery-progress:0%;
  position:relative;
  width:100%;
  min-width:0;
  margin:0;
  overflow:hidden;
  background:#f4f4f2;
}

.ecpdp-gallery__viewport{
  position:relative;
  width:100%;
  min-width:0;
  overflow:hidden;
}

.ecpdp-gallery__track{
  display:flex;
  width:100%;
  gap:var(--ecpdp-gallery-gap);
  margin:0;
  padding:0;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
  touch-action:pan-x pan-y pinch-zoom;
  -webkit-overflow-scrolling:touch;
  cursor:grab;
}

.ecpdp-gallery__track::-webkit-scrollbar{display:none!important}

.ecpdp-gallery__track.is-dragging{
  scroll-snap-type:none;
  scroll-behavior:auto;
  cursor:grabbing;
  user-select:none;
}

.ecpdp-gallery__slide{
  position:relative;
  flex:0 0 calc((100% - var(--ecpdp-gallery-gap))/2);
  width:calc((100% - var(--ecpdp-gallery-gap))/2);
  min-width:calc((100% - var(--ecpdp-gallery-gap))/2);
  max-width:calc((100% - var(--ecpdp-gallery-gap))/2);
  margin:0;
  overflow:hidden;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  background:#f4f4f2;
}

.ecpdp-gallery__link{
  appearance:none!important;
  display:block!important;
  position:relative!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:2/3;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  outline:0;
  background:#f4f4f2!important;
  box-shadow:none!important;
  color:#111!important;
  text-decoration:none!important;
  cursor:zoom-in!important;
  line-height:0!important;
  -webkit-tap-highlight-color:transparent;
}

.ecpdp-gallery__link:focus-visible{outline:1px solid #111;outline-offset:-3px}

.ecpdp-gallery__img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  margin:0!important;
  object-fit:cover!important;
  object-position:center!important;
  background:#f4f4f2!important;
  filter:none!important;
  -webkit-filter:none!important;
  image-rendering:auto!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  user-select:none;
  -webkit-user-drag:none;
}

.ecpdp-gallery__video-link{cursor:zoom-in!important}
.ecpdp-gallery__video{pointer-events:none!important}

.ecpdp-gallery__arrow,
.ecpdp-viewer__arrow,
.ecpdp-viewer__close{
  appearance:none!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  color:#111!important;
  text-decoration:none!important;
  text-transform:none!important;
  -webkit-tap-highlight-color:transparent;
}

.ecpdp-gallery__arrow{
  position:absolute!important;
  top:50%!important;
  z-index:8!important;
  display:grid!important;
  width:44px!important;
  height:58px!important;
  transform:translateY(-50%)!important;
  cursor:pointer!important;
  transition:opacity .18s ease!important;
}

.ecpdp-gallery__arrow--prev{left:4px!important}
.ecpdp-gallery__arrow--next{right:4px!important}
.ecpdp-gallery__arrow[hidden]{display:none!important}
.ecpdp-gallery__arrow:disabled{opacity:.28!important;cursor:default!important}
.ecpdp-gallery__arrow:not(:disabled){opacity:.92!important}

.ecpdp-gallery__arrow svg,
.ecpdp-viewer__arrow svg{
  display:block!important;
  width:24px!important;
  height:24px!important;
  overflow:visible!important;
  fill:none!important;
  stroke:#111!important;
  stroke-width:1.25!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  opacity:1!important;
  visibility:visible!important;
}

.ecpdp-gallery__counter{
  position:absolute;
  left:50%;
  bottom:10px;
  z-index:7;
  width:min(180px,32%);
  height:2px;
  margin:0;
  overflow:hidden;
  color:transparent;
  font-size:0;
  line-height:0;
  transform:translateX(-50%);
  pointer-events:none;
}

.ecpdp-gallery__counter::after,
.ecpdp-gallery__counter::before{position:absolute;inset:0;content:""}
.ecpdp-gallery__counter::after{background:rgba(17,17,17,.18)}
.ecpdp-gallery__counter::before{
  z-index:1;
  width:var(--ecpdp-gallery-progress);
  background:#111;
  transition:width .22s cubic-bezier(.2,.86,.22,1);
}

.ecpdp-gallery__counter span{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

.ecpdp-viewer[hidden]{display:none!important}

.ecpdp-viewer{
  position:fixed!important;
  z-index:2147483000!important;
  inset:0!important;
  display:block;
  width:100vw!important;
  height:100vh!important;
  height:100dvh!important;
  overflow:hidden!important;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  color:#111!important;
  background:#f4f4f2!important;
  transition:opacity .2s ease,visibility 0s linear .2s;
  isolation:isolate;
}

.ecpdp-viewer.is-open{
  visibility:visible;
  opacity:1;
  pointer-events:auto;
  transition:opacity .2s ease;
}

.ecpdp-viewer__viewport{
  position:absolute;
  inset:0;
  z-index:1;
  width:100%;
  height:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  overscroll-behavior:contain;
  touch-action:pan-x pan-y pinch-zoom;
  -webkit-overflow-scrolling:touch;
  outline:0;
}

.ecpdp-viewer__viewport::-webkit-scrollbar{display:none!important}

.ecpdp-viewer__track{
  display:flex;
  width:max-content;
  min-width:100%;
  height:100%;
  margin:0;
  padding:0;
}

.ecpdp-viewer__item{
  display:grid;
  place-items:center;
  flex:0 0 100vw;
  width:100vw;
  height:100vh;
  height:100dvh;
  margin:0;
  padding:clamp(12px,2vw,28px);
  overflow:hidden;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  background:#f4f4f2;
  line-height:0;
}

.ecpdp-viewer__image,
.ecpdp-viewer__video{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  background:#f4f4f2!important;
  filter:none!important;
  -webkit-filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  image-rendering:auto!important;
}

.ecpdp-viewer__video{pointer-events:auto!important}

.ecpdp-viewer__close{
  position:fixed!important;
  z-index:5!important;
  top:14px!important;
  right:14px!important;
  display:grid!important;
  width:38px!important;
  height:38px!important;
  border:1px solid rgba(17,17,17,.18)!important;
  background:rgba(244,244,242,.82)!important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-family:Arial,sans-serif!important;
  font-size:25px!important;
  font-weight:300!important;
  line-height:1!important;
  cursor:pointer!important;
}

.ecpdp-viewer__arrow{
  position:fixed!important;
  top:50%!important;
  z-index:5!important;
  display:grid!important;
  width:48px!important;
  height:60px!important;
  transform:translateY(-50%)!important;
  cursor:pointer!important;
}

.ecpdp-viewer__arrow--prev{left:6px!important}
.ecpdp-viewer__arrow--next{right:6px!important}
.ecpdp-viewer__arrow[hidden]{display:none!important}
.ecpdp-viewer__arrow:disabled{opacity:.25!important;cursor:default!important}

.ecpdp-viewer__counter{
  position:fixed;
  z-index:5;
  top:25px;
  left:18px;
  margin:0;
  color:#111!important;
  font-size:9px!important;
  line-height:1!important;
  letter-spacing:.1em!important;
  pointer-events:none;
}

html.ecpdp-viewer-lock,
body.ecpdp-viewer-lock{overflow:hidden!important;overscroll-behavior:none!important}

@media(min-width:1181px){
  .ecpdp-root--full .ecpdp-layout__gallery .ecpdp-gallery__viewport,
  .ecpdp-root--full .ecpdp-layout__gallery .ecpdp-gallery__track,
  .ecpdp-root--full .ecpdp-layout__gallery .ecpdp-gallery__slide,
  .ecpdp-root--full .ecpdp-layout__gallery .ecpdp-gallery__link{height:100%!important}
  .ecpdp-root--full .ecpdp-layout__gallery .ecpdp-gallery__link,
  .ecpdp-root--full .ecpdp-layout__gallery .ecpdp-gallery__img{aspect-ratio:auto!important}
}

@media(max-width:1180px){
  .ecpdp-gallery__slide{
    flex-basis:100%;
    width:100%;
    min-width:100%;
    max-width:100%;
  }
  .ecpdp-gallery__counter{bottom:8px;width:min(156px,42%)}
}

@media(max-width:767px){
  .ecpdp-gallery__arrow{width:38px!important;height:52px!important}
  .ecpdp-gallery__arrow--prev{left:0!important}
  .ecpdp-gallery__arrow--next{right:0!important}
  .ecpdp-gallery__arrow svg{width:21px!important;height:21px!important}
  .ecpdp-viewer__item{padding:0}
  .ecpdp-viewer__close{top:10px!important;right:10px!important;width:36px!important;height:36px!important}
  .ecpdp-viewer__counter{top:22px;left:14px}
  .ecpdp-viewer__arrow{width:38px!important;height:54px!important}
  .ecpdp-viewer__arrow--prev{left:0!important}
  .ecpdp-viewer__arrow--next{right:0!important}
  .ecpdp-viewer__arrow svg{width:21px!important;height:21px!important}
}

@media(prefers-reduced-motion:reduce){
  .ecpdp-gallery__track,
  .ecpdp-viewer__viewport{scroll-behavior:auto!important}
  .ecpdp-gallery__counter::before,
  .ecpdp-viewer{transition-duration:.01ms!important}
}