.product-media-carousel{position:relative;width:100%}.product-media-gallery-desktop{display:none}.product-media-carousel-mobile-tablet{display:block}@media screen and (min-width: 990px){.product-media-gallery-desktop{display:block}.product-media-carousel-mobile-tablet{display:none}}@media screen and (max-width: 989px){.product-media-gallery-desktop{display:none}.product-media-carousel-mobile-tablet{display:block}}@media screen and (max-width: 989px){product-info[class*=section-]{padding-top:0!important}.page-width{overflow-x:visible}.page-width .product__media-wrapper{position:relative;margin-left:calc(-50vw + 50%)!important;margin-right:calc(-50vw + 50%)!important;padding-left:0!important;padding-right:0!important;width:100vw!important;max-width:100vw!important}.product .product__media-wrapper.grid__item{padding-left:0!important;padding-right:0!important;padding-bottom:0}.product-media-carousel{margin-left:0;margin-right:0;width:100%}}.product-media-carousel__viewport{position:relative}slider-component{position:relative;display:block}.product-media-carousel__slider{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:none!important;scroll-behavior:auto!important;scrollbar-width:none;gap:0;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;transition:none!important;transform:translateZ(0);will-change:scroll-position;touch-action:pan-x pan-y;pointer-events:auto;-webkit-user-select:none;user-select:none}.product-media-carousel .slider,.product-media-carousel .slider--mobile,.product-media-carousel .slider--tablet,.product-media-carousel .slider--desktop,.product-media-carousel__slider,.product-media-carousel__slider.slider,.product-media-carousel__slider.slider--mobile,.product-media-carousel__slider.slider--tablet,.product-media-carousel__slider.slider--desktop,.product-media-carousel .slider.slider--mobile,.product-media-carousel .slider.slider--tablet,.product-media-carousel .slider.slider--desktop{scroll-snap-type:none!important;scroll-behavior:auto!important;scroll-snap-stop:normal!important;transition:none!important;touch-action:pan-x pan-y!important}.product-media-carousel__slider::-webkit-scrollbar{display:none}.product-media-carousel__slide{flex:0 0 90%;width:90%;scroll-snap-align:none!important;scroll-snap-stop:normal!important;position:relative;transition:none!important;transform:translateZ(0);pointer-events:auto}.product-media-carousel .slider__slide,.product-media-carousel__slide,.product-media-carousel__slide.slider__slide,.product-media-carousel .slider.slider--mobile .slider__slide,.product-media-carousel .slider.slider--tablet .slider__slide,.product-media-carousel__slider.slider--mobile .slider__slide,.product-media-carousel__slider.slider--tablet .slider__slide{scroll-snap-align:none!important;scroll-snap-stop:normal!important}@media screen and (min-width: 990px){.product-media-carousel__slide{flex:0 0 100%;width:100%}}.product-media-container{position:relative;width:100%;background:rgb(var(--color-background))}.product-media-container__inner{position:relative;width:100%;aspect-ratio:3/4;display:flex;align-items:center;justify-content:center;overflow:hidden}@media screen and (max-width: 989px){.product-media-container__inner{height:50vh;width:37.5vh;aspect-ratio:auto}.product-media-carousel__slide{flex:0 0 37.5vh;width:37.5vh}.product-media-carousel__slider{gap:5px}.product-media-carousel__image{object-fit:contain}thumbnail-carousel{margin-top:5px}}.product-media-carousel__image{width:100%;height:100%;object-fit:cover;display:block}.media-type-video .product-media-container__inner,.media-type-external_video .product-media-container__inner,.media-type-model .product-media-container__inner{aspect-ratio:16/9}.product-media-container video,.product-media-container iframe,.product-media-container model-viewer{width:100%;height:100%}.slider-buttons{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);display:flex;justify-content:space-between;pointer-events:none;z-index:2;padding:0 1rem}@media screen and (max-width: 989px){.slider-buttons{display:none!important}}.slider-button{pointer-events:auto;display:flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;background:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.1);border-radius:50%;color:rgb(var(--color-foreground));cursor:pointer;transition:all .2s ease;box-shadow:0 .2rem .4rem rgba(var(--color-foreground),.1)}.slider-button:hover:not(:disabled){background:rgba(var(--color-foreground),.05);border-color:rgba(var(--color-foreground),.2);transform:scale(1.05)}.slider-button:disabled{opacity:.3;cursor:not-allowed}.slider-button svg{width:1.6rem;height:1.6rem}.slider-button--prev svg{transform:rotate(90deg)}.slider-button--next svg{transform:rotate(-90deg)}thumbnail-carousel{display:block;position:relative;margin-top:5px}.thumbnail-carousel__list-wrapper{overflow:hidden;position:relative}.thumbnail-carousel__list{display:flex;gap:5px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;list-style:none;margin:0;padding:0}.thumbnail-carousel__list::-webkit-scrollbar{display:none}.thumbnail-carousel__item{flex:0 0 auto}.thumbnail-carousel__thumb{position:relative;display:block;width:8rem;height:10rem;border:none;border-bottom:2px solid transparent;border-radius:0;overflow:visible;cursor:pointer;transition:all .2s ease;background:transparent;padding:0;box-sizing:border-box}.thumbnail-carousel__thumb:hover{border-bottom-color:rgba(var(--color-foreground),.2)}.thumbnail-carousel__thumb.is-active{border-bottom-color:rgb(var(--color-foreground))}.thumbnail-carousel__thumb img{width:100%;height:calc(100% - 2px);object-fit:cover;display:block;border-radius:0;background:rgb(var(--color-background))}.thumbnail-carousel__badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:3.2rem;height:3.2rem;background:rgba(var(--color-foreground),.8);border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:1}.thumbnail-carousel__badge svg{width:1.6rem;height:1.6rem;fill:rgb(var(--color-background))}.thumbnail-carousel__button{position:absolute;top:50%;transform:translateY(-50%);width:3.2rem;height:3.2rem;background:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.1);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2;transition:all .2s ease;box-shadow:0 .2rem .4rem rgba(var(--color-foreground),.1)}.thumbnail-carousel__button:hover:not(:disabled){background:rgba(var(--color-foreground),.05);border-color:rgba(var(--color-foreground),.2)}.thumbnail-carousel__button:disabled{opacity:0;pointer-events:none}.thumbnail-carousel__button--prev{left:-1.6rem}.thumbnail-carousel__button--next{right:-1.6rem}.thumbnail-carousel__button svg{width:1.2rem;height:1.2rem}.thumbnail-carousel__button--prev svg{transform:rotate(90deg)}.thumbnail-carousel__button--next svg{transform:rotate(-90deg)}.product-media-modal__opener{position:fixed;bottom:1.6rem;right:1.6rem;z-index:10}@media screen and (min-width: 990px){.product-media-modal__opener{position:absolute;bottom:1.6rem;right:1.6rem}}.product-media-modal__button{display:flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;background:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.1);border-radius:50%;cursor:pointer;transition:all .2s ease;box-shadow:0 .2rem .4rem rgba(var(--color-foreground),.1)}.product-media-modal__button:hover{background:rgba(var(--color-foreground),.05);border-color:rgba(var(--color-foreground),.2);transform:scale(1.05)}.product-media-modal__button svg{width:2rem;height:2rem}product-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;background:rgba(var(--color-foreground),.9);display:none;align-items:center;justify-content:center;padding:2rem}product-modal[open]{display:flex}.product-media-modal__dialog{position:relative;max-width:120rem;max-height:90vh;width:100%;background:rgb(var(--color-background));border-radius:.8rem;overflow:hidden}.product-media-modal__toggle{position:absolute;top:1.6rem;right:1.6rem;width:4.4rem;height:4.4rem;background:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.1);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:all .2s ease}.product-media-modal__toggle:hover{background:rgba(var(--color-foreground),.05);transform:scale(1.05)}.product-media-modal__toggle svg{width:2rem;height:2rem}.product-media-modal__content{width:100%;height:100%;overflow:auto}.product-media-modal__content-item{display:none;width:100%;padding:2rem}.product-media-modal__content-item.is-active{display:flex;align-items:center;justify-content:center}.product-media-modal__content-item img{max-width:100%;max-height:calc(90vh - 4rem);width:auto;height:auto;display:block}@media screen and (max-width: 989px){.slider-buttons{display:none!important}.thumbnail-carousel__button{display:none}.thumbnail-carousel__thumb{width:6rem;height:7.5rem}.product-media-modal__button{width:3.6rem;height:3.6rem}.product-media-modal__button svg{width:1.6rem;height:1.6rem}product-modal{padding:1rem}}@media screen and (min-width: 990px){.thumbnail-carousel__list{gap:1rem}.thumbnail-carousel__thumb{width:9rem;height:11.25rem}}@media screen and (min-width: 990px){.product-media-carousel__viewport{display:flex;gap:2rem}.product-media-carousel__slider{flex:1}.thumbnail-carousel__thumb{width:10rem;height:12.5rem}}@media screen and (min-width: 990px){media-carousel[data-desktop-layout=grid] .product-media-carousel__slider{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;overflow:visible;scroll-snap-type:none}media-carousel[data-desktop-layout=grid] .product-media-carousel__slide{flex:none;width:auto}media-carousel[data-desktop-layout=grid] .slider-buttons{display:none}media-carousel[data-desktop-layout=grid] thumbnail-carousel{display:none}}.no-js-hidden{display:none}.js .no-js-hidden{display:block}.overflow-hidden{overflow:hidden}.product-media-carousel:not(.media-carousel--loaded){opacity:0}.media-carousel--loaded{opacity:1;transition:opacity .3s ease}.slider-button:focus-visible,.thumbnail-carousel__button:focus-visible,.thumbnail-carousel__thumb:focus-visible,.product-media-modal__button:focus-visible,.product-media-modal__toggle:focus-visible{outline:.2rem solid rgb(var(--color-foreground));outline-offset:.2rem}
/*# sourceMappingURL=/cdn/shop/t/8/assets/product-media-carousel.css.map */
