.product__media-list .deferred-media{display:none}.product-media-modal{background-color:rgb(var(--color-background));box-sizing:border-box;position:static;pointer-events:none;top:0;left:0;width:0;height:0}.product-media-modal[open]{position:fixed;height:100%;width:100%}.product-media-modal:not([open]){content-visibility:hidden!important}.product-media-modal:not([open]) *{display:none;content-visibility:hidden!important}@media screen and (min-width: 750px){.product-media-modal{padding:0}}.product-media-modal[open]{z-index:101;opacity:1;pointer-events:visible;transform:scale(1);transition-property:opacity,transform;transition-timing-function:ease;transition-duration:var(--duration-long)}.product-media-modal__content{height:100vh;overflow:auto;width:100%}@supports (height: 100svh){.product-media-modal__content{height:100svh}}@media screen and (min-width: 750px){.product-media-modal__content{height:100vh}.product__modal-opener:not(.product__modal-opener--image){display:none}.product__media-list .deferred-media{display:block}}.product-media-modal__content>*{width:100%;height:auto;margin:auto}.product-media-modal__content .media{background:none}.product-media-modal__model{width:100%}.product-media-modal__toggle{color:rgb(var(--color-foreground));background-color:rgb(var(--color-background));box-shadow:0 0 4rem rgb(from rgb(var( --color-foreground )) r g b,.2);border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:1.2rem;position:fixed;top:2rem;right:2rem;z-index:2;width:4.4rem;height:4.4rem}.product-media-modal__content .deferred-media{width:100%}@media screen and (min-width: 750px){.product-media-modal__toggle{width:6rem;height:6rem;right:4.8rem;top:3.5rem}}@media screen and (min-width: 990px){.product-media-modal__toggle{right:4.3rem;top:3rem}}.product-media-modal__toggle .icon{pointer-events:none;display:block;position:relative;width:2rem;height:2rem;transform:rotate(45deg);transition:transform var(--duration-default) ease}@media screen and (min-width: 750px){.product-media-modal__toggle .icon{width:3rem;height:3rem}}@media screen and (hover: hover){.product-media-modal__toggle:hover .icon{transform:scale(.8) rotate(135deg)}}
/*# sourceMappingURL=/cdn/shop/t/8/assets/Product-Modal.css.map */
