/* THE DOGS · Image-first gallery controls, scoped to product galleries. */
[data-td-gallery-stage] {
  touch-action: pan-x pan-y pinch-zoom !important;
}
[data-td-gallery-stage] :is(#image-open, #zoom-image, [data-td-image-zoom]) {
  touch-action: pan-x pan-y pinch-zoom !important;
}
[data-td-gallery-root] [data-td-zoom-icon] {
  display: none !important;
}
[data-td-gallery-root] [data-td-gallery-nav] {
  position: static !important;
  inset: auto !important;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-height: 52px;
  padding: 4px 0 !important;
  margin: 0;
  background: transparent !important;
  color: inherit;
  pointer-events: auto !important;
}
[data-td-gallery-root] [data-td-gallery-nav] > button {
  position: static !important;
  inset: auto !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px;
  min-height: 44px;
  padding: 0 !important;
  margin: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: inherit;
  cursor: pointer;
  touch-action: manipulation;
}
[data-td-gallery-root] [data-td-gallery-nav] > :is(span, .gallery-counter) {
  position: static !important;
  inset: auto !important;
  min-width: 48px;
  padding: 0 !important;
  background: transparent !important;
  color: inherit !important;
  text-align: center;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
[data-td-gallery-root] [data-td-gallery-nav] button svg {
  width: 20px;
  height: 20px;
  pointer-events: none;
}
[data-td-gallery-root] [data-td-gallery-nav] button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -4px;
}
[data-td-gallery-root] [data-td-image-zoom] {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: zoom-in;
}
[data-td-gallery-root] [data-td-image-zoom] > * {
  display: none !important;
}
[data-td-gallery-root] [data-td-image-zoom][data-td-zoom-available='false'] {
  display: none !important;
}
[data-td-gallery-root] [data-td-image-zoom]:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -5px;
}
/* Dawn keeps native scrolling: do not replace it with synthetic dragging. */
[id^='MainProduct-'] media-gallery .product__media-list,
[id^='MainProduct-'] media-gallery .product__modal-opener--image,
[id^='MainProduct-'] media-gallery .product__media-toggle,
[id^='MainProduct-'] media-gallery deferred-media {
  touch-action: pan-x pan-y pinch-zoom;
}
[id^='MainProduct-'] media-gallery .product__modal-opener--image .product__media-icon {
  display: none !important;
}
@media (min-width: 990px) {
  [id^='MainProduct-'] media-gallery .td-gallery-desktop-arrows {
    position: static !important;
    inset: auto !important;
    min-height: 52px;
    justify-content: flex-end;
    gap: 8px;
    padding: 4px 0 !important;
    pointer-events: auto;
  }
  [id^='MainProduct-'] media-gallery .td-gallery-arrow {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-td-gallery-root] [data-td-gallery-nav] button { transition: none; }
}

.td-pdp-video-controls {
  position: static !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 44px;
  width: 100%;
  padding: 0;
  color: inherit;
  background: transparent;
}
.td-pdp-video-controls[hidden] { display: none !important; }
.td-pdp-video-controls > button {
  position: static !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  padding: 10px 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-family: inherit;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .02em;
  text-transform: none;
  cursor: pointer;
  box-shadow: none;
  touch-action: manipulation;
}
.td-pdp-video-controls > button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -3px;
}
.td-pdp-video-controls > button[hidden] { display: none !important; }
.td-pdp-video-controls .td-video-audio-note {
  color: inherit;
  font-family: inherit;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .02em;
  opacity: .7;
}
.td-pdp-video-controls .td-video-audio-note[hidden] { display: none !important; }
.td-pdp-video-block { min-width: 0; width: 100%; }
[data-td-video-gallery] :is(#video-play,#gallery-video-play) { display: none !important; }
:is(.ugc-media,.motion-media,.video-card):has(video[data-td-video-managed]) > :is(.ugc-play,.motion-toggle,.video-play) { display: none !important; }
video[data-td-video-managed]::-webkit-media-controls { display: none !important; }
video[data-td-video-managed]::-webkit-media-controls-enclosure { display: none !important; }



[data-td-gallery-root] [data-td-native-gallery] .td-native-viewport {
  background: inherit;
  position: absolute;
  inset: 0;
  display: flex;
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: auto;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y pinch-zoom !important;
}
[data-td-gallery-root] .td-native-viewport::-webkit-scrollbar { display: none; }
[data-td-gallery-root] .td-native-slide {
  background: inherit;
  position: relative;
  flex: 0 0 100%;
  width: 100%;
  min-width: 0;
  height: 100%;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
[data-td-gallery-root] .td-native-live {
  position: relative;
  width: 100%;
  height: 100%;
}
[data-td-gallery-root] .td-native-slide > .td-native-preview {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: inherit;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
}
[data-td-gallery-root] .td-native-slide > .td-native-preview[hidden] { display: none !important; }
[data-td-gallery-root] .td-native-slide > .td-native-placeholder {
  display: grid;
  place-items: center;
  padding: 24px;
  text-align: center;
}
:is(#td-asiento,#td-cama,#td-comedero,#td-elevada,#td-nido) .td-native-live > :is(img,video) {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
:is(#td-cama,#td-comedero) .td-native-live > img,
:is(#td-cama,#td-comedero) .td-native-slide > .td-native-preview { object-fit: cover; }
#td-asiento .td-native-live > video { background: #dedad3; }
#td-cama .td-native-live > video { background: #171713; }
#td-comedero .td-native-live > video { background: #ddd9d1; }
#td-elevada .td-native-live > video { background: #161b15; }
#td-nido .td-native-live > video { background: #25231f; }
#td-nails .hero-media[data-td-native-gallery],
#td-piel-editorial .gallery-shell[data-td-native-gallery] { aspect-ratio: 1; }
#td-nails .td-native-live > button:first-child { padding: 0; width: 100%; height: 100%; display: block; }
#td-piel-editorial .td-native-slide > .td-native-preview { object-fit: cover; }
#td-luxury-editorial .td-native-slide > .td-native-preview { object-fit: cover; }
/* Match the poster to the video's framing so the handoff does not change its edges. */
[data-td-gallery-root] .td-native-slide > .td-native-video-preview { object-fit: contain; }
:is(#td-cama,#td-comedero) .td-native-slide > .td-native-video-preview { object-fit: contain; }
#td-rampa-editorial .td-native-slide > .td-native-video-preview { background: #282721; }
#funda-editorial .td-native-slide > .td-native-video-preview { background: #272924; }
:is(#td-nails,#td-cama) .td-native-slide > .td-native-video-preview { background: #171713; }
#td-comedero .td-native-slide > .td-native-video-preview { background: #ddd9d1; }
#td-elevada .td-native-slide > .td-native-video-preview { background: #161b15; }
#td-asiento .td-native-slide > .td-native-video-preview { background: #dedad3; }
#td-nido .td-native-slide > .td-native-video-preview { background: #25231f; }
#td-luxury-editorial .td-native-slide > .td-native-video-preview { background: #211f1a; object-fit: contain; }
#td-impermeable-editorial .td-native-slide > .td-native-video-preview { background: #1c211d; }
[data-td-gallery-root] .td-native-live :is(.gallery-tag,.gallery-mark,.gallery-edition,.video-caption) { z-index: 2; }

:is(#td-rampa-editorial,#td-majestuoso-editorial,#funda-editorial,#td-nails,#td-cama,#td-elevada,#td-comedero,#td-asiento,#td-nido,#td-piel-editorial,#td-luxury-editorial,#td-impermeable-editorial,[id^="MainProduct-"]) .td-video-overlay {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  pointer-events: none;
  color: #282721;
  font-family: inherit;
  line-height: 1.4;
  text-align: center;

  &[hidden] { display: none !important; }

  &, & * { box-sizing: border-box; }

  & > button {
    min-width: 48px;
    min-height: 48px;
    margin: 0;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: .01em;
    text-transform: none;
    text-decoration: none;
    appearance: none;
    pointer-events: auto;
    touch-action: pan-x pan-y pinch-zoom;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  & > button[hidden] { display: none !important; }

  & > button:focus-visible {
    outline: 2px solid #faf8f4;
    outline-offset: 3px;
    box-shadow: 0 0 0 5px #282721;
  }

  & .td-video-overlay__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: max-content;
    max-width: calc(100% - 32px);
    padding: 12px 16px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #282721;
    box-shadow: none;
  }

  & .td-video-overlay__play > svg {
    display: block;
    flex: 0 0 64px;
    width: 64px;
    height: 64px;
    padding: 19px;
    border: 1px solid rgba(255, 255, 255, .85);
    border-radius: 50%;
    background: rgba(250, 248, 244, .96);
    color: #282721;
    box-shadow: 0 3px 18px rgba(0, 0, 0, .16);
    pointer-events: none;
  }

  & .td-video-overlay__play > span {
    display: block;
    max-width: 260px;
    padding: 8px 13px;
    border: 1px solid rgba(250, 248, 244, .25);
    border-radius: 3px;
    background: rgba(40, 39, 33, .86);
    color: #faf8f4;
    font: inherit;
    text-align: center;
    text-shadow: none;
    pointer-events: none;
  }

  & .td-video-overlay__sound {
    position: absolute;
    right: 12px;
    bottom: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    max-width: calc(100% - 24px);
    padding: 11px 14px;
    border: 1px solid rgba(255, 255, 255, .8);
    border-radius: 3px;
    background: rgba(250, 248, 244, .96);
    color: #282721;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
  }

  & .td-video-overlay__sound > svg {
    display: block;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    padding: 0;
    pointer-events: none;
  }

  & .td-video-overlay__sound > span { pointer-events: none; }

  &[data-state="loading"] .td-video-overlay__play {
    cursor: progress;
    opacity: 1;
  }

  &[data-state="loading"] .td-video-overlay__play > svg { border-style: dashed; }
  &[data-state="retry"] .td-video-overlay__play > span { background: #282721; }
  &[data-state="playing"] .td-video-overlay__play,
  &:not([data-state="playing"]) .td-video-overlay__sound { display: none !important; }

  @media (prefers-reduced-motion: reduce) {
    &, & * { animation: none !important; transition: none !important; }
  }
}

