/* CASE2CASE PDP GALLERY UNIFIED MOBILE V1.0.0
 * Design-video + no-print-video only. Reserved navigation footer;
 * no overlays on burned-in watermark/material caption.
 * Desktop appearance is intentionally unchanged.
 */
@media (max-width:760px) {
  #pdp-media-card.c2c-design-v100-card,
  #pdp-media-card.c2c-np-video-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
    aspect-ratio: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
  }

  #pdp-media-card.c2c-design-v100-card > .c2c-design-v100-gallery,
  #pdp-media-card.c2c-np-video-card > .c2c-np-video-gallery {
    flex: 0 0 auto !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    min-height: 0 !important;
    min-width: 0 !important;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
  }

  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-slide,
  #pdp-media-card.c2c-np-video-card .c2c-np-video-slide {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    height: 100% !important;
    box-sizing: border-box;
    scroll-snap-align: start;
  }

  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-slide video,
  #pdp-media-card.c2c-np-video-card .c2c-np-video-slide video,
  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-slide #pdp-main-image,
  #pdp-media-card.c2c-np-video-card .c2c-np-video-slide #pdp-main-image {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    transform: none !important;
  }

  /* One common capsule, in a dedicated white row below the media. */
  #pdp-media-card.c2c-design-v100-card > .c2c-design-v100-nav,
  #pdp-media-card.c2c-np-video-card > .c2c-np-video-nav {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 40px !important;
    width: max-content !important;
    height: 40px !important;
    max-width: calc(100% - 16px) !important;
    box-sizing: border-box;
    gap: 0 !important;
    padding: 0 5px !important;
    margin: 7px auto 9px !important;
    border: 1px solid #e8edf2;
    border-radius: 999px !important;
    background: #fff !important;
    box-shadow: 0 3px 12px rgba(0,0,0,.10) !important;
    z-index: 3;
  }

  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 !important;
    order: 2;
  }

  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-arrow,
  #pdp-media-card.c2c-np-video-card .c2c-np-video-arrow {
    appearance: none;
    position: static !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px !important;
    width: 40px !important;
    height: 38px !important;
    min-width: 40px;
    min-height: 38px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #111 !important;
    font-size: 28px !important;
    line-height: 1 !important;
    font-family: Arial,sans-serif;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-arrow.prev { order: 1; }
  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-arrow.next { order: 3; }
  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-arrow:disabled { opacity: .3; }

  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-dot,
  #pdp-media-card.c2c-np-video-card .c2c-np-video-dot {
    appearance: none;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 25px !important;
    width: 25px !important;
    height: 38px !important;
    min-height: 38px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-dot::before,
  #pdp-media-card.c2c-np-video-card .c2c-np-video-dot::before {
    content: '';
    display: block;
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #bdc4cc;
    transition: width .16s ease,background .16s ease;
  }
  #pdp-media-card.c2c-design-v100-card .c2c-design-v100-dot.is-active::before,
  #pdp-media-card.c2c-np-video-card .c2c-np-video-dot.is-active::before {
    width: 19px;
    background: #141414;
  }
  #pdp-media-card.c2c-design-v100-card button:focus-visible,
  #pdp-media-card.c2c-np-video-card button:focus-visible {
    outline: 2px solid #275ef6;
    outline-offset: 2px;
  }
}