.product-media-modal{background-color:rgb(var(--color-background));height:100%;position:fixed;top:0;left:0;width:100%;visibility:hidden;opacity:0;z-index:-1}.product-media-modal[open]{visibility:visible;opacity:1;z-index:101}.product-media-modal__dialog{display:flex;align-items:center;height:100vh}.product-media-modal__content{max-height:100vh;width:100%;overflow:auto}.product-media-modal__content>*:not(.active){display:none}.product-media-modal__content>*{display:block;height:auto;margin:auto}.product-media-modal__content .media{background:none}.product-media-modal__content .deferred-media,.product-media-modal__model{width:100%}.product-media-modal__toggle{background-color:rgb(var(--color-background));border:.1rem solid rgba(var(--color-foreground),.1);border-radius:50%;color:rgba(var(--color-foreground),.55);display:flex;align-items:center;justify-content:center;cursor:pointer;right:2rem;padding:1.2rem;position:fixed;z-index:2;top:2rem;width:4rem}.product-media-modal__toggle:hover{color:rgba(var(--color-foreground),.75)}.product-media-modal__toggle:hover>.icon,.product-media-modal__toggle:hover>svg{transform:rotate(90deg)}.product-media-modal__toggle:active{color:rgba(var(--color-foreground),.75)}.product-media-modal__toggle:active>.icon,.product-media-modal__toggle:active>svg{transform:rotate(90deg) scale(.85)}.product-media-modal__toggle .icon,.product-media-modal__toggle svg{height:auto;margin:0;width:2.2rem;transition:transform var(--duration-short) ease}@media screen and (min-width:750px){.product-media-modal__content{padding:2rem 11rem}.product-media-modal__content>*:not(.active){display:block}.product-media-modal__content>*{width:100%}.product-media-modal__content>*+*{margin-top:2rem}.product-media-modal__content>.product__media-item--variant.product__media-item--variant{display:none}.product-media-modal__content>.product__media-item--variant:first-child{display:block}.product-media-modal__toggle{right:5rem;top:2.2rem}}@media screen and (min-width:990px){.product-media-modal__content{padding:2rem 11rem 1.5rem}.product-media-modal__content>*+*{margin-top:1.5rem}.product-media-modal__toggle{right:5rem}}@media screen and (min-width:750px)and (max-width:989px){.product-media-modal__dialog .global-media-settings--no-shadow{overflow:visible!important}}@media screen and (max-width:749px){.product-media-modal__dialog .global-media-settings,.product-media-modal__dialog .global-media-settings video,.product-media-modal__dialog .global-media-settings model-viewer,.product-media-modal__dialog .global-media-settings iframe,.product-media-modal__dialog .global-media-settings img{border:none;border-radius:0}}.pi-modal{cursor:default}.pi-modal .product-media-modal__dialog{position:absolute;top:0;right:0;bottom:0;left:0;align-items:center;width:100%;height:100%}.pi-modal .product-media-modal__content{display:flex;align-items:center;justify-content:center;width:100%;height:100vh;max-height:100vh;padding:0;overflow:hidden}.pi-modal .product-media-modal__content>.pi-modal__slider{display:block;width:100%;height:100%;margin:0}.pi-modal .product-media-modal__toggle{z-index:5}.pi-modal .pi-modal__slider{position:relative;row-gap:0;column-gap:0}.pi-modal .pi-modal__swiper{width:100%;height:100%}.pi-modal .pi-modal__swiper .swiper-wrapper{align-items:center;height:100%}.pi-modal .pi-modal__slide{display:flex;align-items:center;justify-content:center;height:100%;padding:6rem 11rem}.pi-modal .pi-modal__slide .swiper-zoom-container{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.pi-modal .pi-modal__slide img{width:auto;height:auto;max-width:100%;max-height:100%;border:0;border-radius:0;object-fit:contain}.pi-modal .pi-modal__slide .deferred-media,.pi-modal .pi-modal__slide .product-media-modal__model{width:100%;max-width:110rem;border:0;border-radius:0}.pi-modal .swiper-main-wrapper .nav-btns{display:contents}.pi-modal .swiper-main-wrapper .btn-arrow{position:absolute;top:50%;z-index:4;display:flex;align-items:center;justify-content:center;width:38px;height:38px;margin:-19px 0 0;padding:0;background:none;border:1px solid rgba(var(--color-foreground),.1);border-radius:5px;color:rgb(var(--color-foreground));cursor:pointer;transition:border-color .2s ease,opacity .2s ease}.pi-modal .swiper-main-wrapper .btn-arrow:hover{border-color:rgb(var(--color-foreground))}.pi-modal .swiper-main-wrapper .btn-arrow.swiper-button-prev{left:2rem;right:auto}.pi-modal .swiper-main-wrapper .btn-arrow.swiper-button-next{right:2rem;left:auto}.pi-modal .swiper-main-wrapper .btn-arrow svg{width:18px;height:18px}.pi-modal .swiper-main-wrapper .btn-arrow.swiper-button-prev svg{transform:rotate(-90deg)}.pi-modal .swiper-main-wrapper .btn-arrow.swiper-button-next svg{transform:rotate(90deg)}.pi-modal .swiper-main-wrapper .btn-arrow.swiper-button-disabled{opacity:.3;pointer-events:none}.pi-modal .swiper-main-wrapper .swiper-pagination{position:absolute;right:0;bottom:2.4rem;left:0;z-index:4;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:10px;width:auto;margin:0}.pi-modal .swiper-pagination .swiper-pagination-bullet{width:8px;height:8px;margin:0!important;border-radius:10px;background:rgb(var(--color-foreground));opacity:.2;transition:all .3s ease}.pi-modal .swiper-pagination .swiper-pagination-bullet-active{opacity:1}.pi-modal .swiper-pagination.border .swiper-pagination-bullet{background:transparent;outline:1px solid rgb(var(--color-foreground))}.pi-modal .swiper-pagination.line .swiper-pagination-bullet{width:40px;height:3px;border-radius:0}.pi-modal .swiper-pagination.number{counter-reset:pi-modal-dot}.pi-modal .swiper-pagination.number .swiper-pagination-bullet{width:auto;height:auto;background:transparent;font-size:1.5rem;font-weight:500;color:rgb(var(--color-foreground));opacity:.6}.pi-modal .swiper-pagination.number .swiper-pagination-bullet:before{counter-increment:pi-modal-dot;content:counter(pi-modal-dot,decimal-leading-zero)}.pi-modal .swiper-pagination.number .swiper-pagination-bullet-active{opacity:1;text-decoration:underline;text-underline-offset:2px}@media screen and (max-width:989px){.pi-modal .pi-modal__slide{padding:6rem 7rem}}@media screen and (max-width:749px){.pi-modal .pi-modal__slide{padding:7rem 2rem 6rem}.pi-modal .swiper-main-wrapper .btn-arrow{width:36px;height:38px;margin-top:-19px;border-color:rgba(var(--color-foreground),.2)}.pi-modal .swiper-main-wrapper .btn-arrow.swiper-button-prev{left:1rem}.pi-modal .swiper-main-wrapper .btn-arrow.swiper-button-next{right:1rem}.pi-modal .swiper-main-wrapper .swiper-pagination{bottom:1.6rem}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/component-product-media-modal.css.map */