product-modal.product-media-modal{display:none;visibility:visible;opacity:1;z-index:101}product-modal.product-media-modal[open],product-modal.product-media-modal.is-closing{display:block}product-modal.product-media-modal.is-closing{pointer-events:none}product-modal .product-media-modal__dialog{position:relative;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;align-items:stretch;height:100vh;height:100dvh}product-modal .product-media-modal__content{grid-area:1 / 1;display:flex;min-height:0;max-height:none;padding:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior:contain;scrollbar-width:none;touch-action:pan-x pinch-zoom}product-modal .product-media-modal__content::-webkit-scrollbar{display:none}product-modal .product-media-modal__content:focus-visible{outline-offset:-.3rem}product-modal .product-media-modal__content>.product-media-modal__slide{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 100%;width:100%;height:100%;margin:0;padding:0;overflow:hidden;scroll-snap-align:center;scroll-snap-stop:always;container-type:size}product-modal .product-media-modal__content>.product-media-modal__slide--variant:not(:first-child){display:none}product-modal .product-media-modal__slide>img{display:block;width:100%;height:auto;max-width:100%;max-height:100%;aspect-ratio:var(--ratio);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}@supports (width: 1cqw){product-modal .product-media-modal__slide>img{width:min(100cqw,calc(100cqh * var(--ratio)));max-width:none;max-height:none}}product-modal .product-media-modal__slide .deferred-media,product-modal .product-media-modal__slide .product-media-modal__model{width:100%;max-height:100%}product-modal .product-media-modal__toggle{top:1.2rem;right:1.2rem;background-color:rgba(var(--color-background),.85)}product-modal .product-media-modal__arrow{display:none;grid-area:1 / 1;align-self:center;justify-self:start;z-index:1;width:4.4rem;height:4.4rem;margin:0 2rem;padding:0;align-items:center;justify-content:center;border:.1rem solid rgba(var(--color-foreground),.1);border-radius:50%;background-color:rgba(var(--color-background),.85);color:rgba(var(--color-foreground),.75);cursor:pointer}product-modal .product-media-modal__arrow--next{justify-self:end}product-modal .product-media-modal__arrow .icon{width:1.2rem;height:auto}product-modal .product-media-modal__arrow--prev .icon{transform:rotate(90deg)}product-modal .product-media-modal__arrow--next .icon{transform:rotate(-90deg)}product-modal .product-media-modal__arrow:hover:enabled{color:rgb(var(--color-foreground))}product-modal .product-media-modal__arrow:disabled{opacity:.3;cursor:default}product-modal .product-media-modal__thumbs{grid-area:2 / 1;display:flex;gap:.8rem;padding:.8rem 1.6rem max(1.2rem,env(safe-area-inset-bottom));overflow-x:auto;scrollbar-width:none}product-modal .product-media-modal__thumbs[hidden]{display:none}product-modal .product-media-modal__thumbs::-webkit-scrollbar{display:none}product-modal .product-media-modal__thumbs button{flex:0 0 auto;width:5.2rem;height:5.2rem;padding:0;border:0;border-radius:.4rem;background:none;opacity:.6;outline:.2rem solid transparent;outline-offset:.2rem;cursor:pointer}product-modal .product-media-modal__thumbs button:first-child{margin-inline-start:auto}product-modal .product-media-modal__thumbs button:last-child{margin-inline-end:auto}product-modal .product-media-modal__thumbs button[aria-current]{opacity:1;outline-color:rgb(var(--color-foreground))}product-modal .product-media-modal__thumbs button:focus-visible{opacity:1;outline-color:rgb(var(--color-foreground));outline-style:dashed}product-modal .product-media-modal__thumbs img{display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover}@media screen and (min-width:750px){product-modal .product-media-modal__content>.product-media-modal__slide{padding:2rem 9rem}product-modal .product-media-modal__toggle{top:2rem;right:2rem}product-modal .product-media-modal__thumbs button{width:6.4rem;height:6.4rem}product-modal .product-media-modal__thumbs button:hover{opacity:1}}@media(hover:hover)and (pointer:fine){product-modal .product-media-modal__arrow:not([hidden]){display:flex}product-modal .product-media-modal__slide>img{cursor:zoom-in}product-modal .product-media-modal__slide[data-zoomed]>img{cursor:zoom-out;transform:scale(2.5)}}@media(prefers-reduced-motion:no-preference){product-modal.product-media-modal[open]{animation:product-modal-fade .2s ease-out}product-modal.product-media-modal[open] .product-media-modal__dialog{animation:product-modal-scale .2s ease-out}product-modal.product-media-modal.is-closing:not([open]){animation:product-modal-fade .16s ease-in reverse forwards}product-modal.product-media-modal.is-closing:not([open]) .product-media-modal__dialog{animation:product-modal-scale .16s ease-in reverse forwards}product-modal .product-media-modal__slide>img{transition:transform .2s ease-out}}@keyframes product-modal-fade{0%{opacity:0}}@keyframes product-modal-scale{0%{transform:scale(.96)}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/product-modal-thumbs.css.map */