.product-media-gallery{width:100%;max-width:100%}.media-gallery__main{position:relative;width:100%}.media-gallery__viewport{width:100%;overflow:hidden;border-radius:var(--media-radius, 0)}.media-gallery__list{display:flex;list-style:none;margin:0;padding:0}.media-gallery__item{width:100%;flex-shrink:0;position:relative}.media-gallery__image{display:block;width:100%;height:auto;object-fit:cover}.media-zoom-trigger{position:relative;display:block;width:100%;padding:0;border:none;background:none;cursor:zoom-in}.media-zoom-icon{position:absolute;top:1rem;right:1rem;width:3rem;height:3rem;background:#ffffffe6;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease;pointer-events:none}.media-zoom-icon .icon{width:1.8rem;height:1.8rem}.media-zoom-trigger:hover .media-zoom-icon{opacity:1}.media-video{width:100%;aspect-ratio:16 / 9}.media-video video,.media-video iframe{width:100%;height:100%;border-radius:var(--media-radius, 0)}@media screen and (min-width: 751px){.media-gallery__item:not(.is-active){display:none}.media-gallery__controls--mobile,.media-gallery__indicator--mobile{display:none}.media-gallery__thumbnails{display:flex;align-items:center;gap:1rem;margin-top:1rem;position:relative}.thumbnail-viewport{flex:1;overflow:hidden;position:relative;width:100%}.thumbnail-list{display:flex;flex-wrap:nowrap;gap:1rem;list-style:none;margin:0;padding:0;transition:transform .3s ease}.thumbnail-list__item{flex-shrink:0;width:80px}.thumbnail{position:relative;display:block;width:100%;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;transition:all .3s ease;background:none}.thumbnail img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover}.thumbnail:hover,.thumbnail.is-active{border-color:#dd9fb4}.thumbnail-nav{border:none;display:flex;background:none;align-items:center}.thumbnail-nav:disabled{opacity:.3;cursor:not-allowed}.thumbnail-nav svg{width:2rem;height:2rem;color:#000}.thumbnail__badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:3rem;height:3rem;background:#ffffffe6;border-radius:50%;display:flex;align-items:center;justify-content:center;pointer-events:none}.thumbnail__badge svg{width:1.4rem;height:1.4rem}}@media screen and (max-width: 750px){.media-gallery__viewport{overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}.media-gallery__viewport::-webkit-scrollbar{display:none}.media-gallery__list{gap:1rem}.media-gallery__item{scroll-snap-align:start;min-width:calc(100% - 3rem)}.media-gallery__controls{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);display:flex;justify-content:space-between;padding:0 .5rem;pointer-events:none}.media-nav{background:none;border:none;padding:0}.media-nav svg{width:2rem;height:2rem}.media-nav:active{transform:scale(.95)}.media-gallery__indicator{position:absolute;bottom:5px;left:5px;background:#000000b3;color:#fff;padding:3px 5px;border-radius:.2rem;font-size:var(--font-size-xs)}.media-gallery__thumbnails,.media-zoom-icon{display:none}}.media-zoom-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;z-index:9999;display:flex;align-items:center;justify-content:center;padding:2rem}.media-zoom-modal[hidden]{display:none}.media-zoom-modal__close{position:absolute;top:2rem;right:2rem;width:4rem;height:4rem;background:#fff3;border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;z-index:10}.media-zoom-modal__close:hover{background:#ffffff4d}.media-zoom-modal__close .icon{width:2.4rem;height:2.4rem;color:#fff}.media-zoom-modal__content{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.media-zoom-modal__image{max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-out}@media screen and (max-width: 750px){.media-zoom-modal{padding:1rem}.media-zoom-modal__close{top:1rem;right:1rem;width:3.6rem;height:3.6rem}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/component-product-media-gallery.css.map */
