.variant-gallery{position:relative;display:flex;flex-direction:column;gap:2.4rem}.variant-gallery__main{overflow:hidden;aspect-ratio:var(--variant-gallery-ratio, 1 / 1);background:rgb(var(--color-background));border-radius:8px}.variant-gallery__main .splide__track,.variant-gallery__main .splide__list,.variant-gallery__main .splide__slide{height:100%}.variant-gallery__main .splide__slide{display:flex;align-items:center;justify-content:center}.variant-gallery__zoom-trigger{all:unset;position:relative;display:block;width:100%;height:100%;cursor:zoom-in;border-radius:8px}.variant-gallery__image{width:100%;height:100%;object-fit:contain;display:block;border-radius:8px}.variant-gallery__zoom-icon{position:absolute;top:1.2rem;right:1.2rem;display:flex;align-items:center;justify-content:center;width:3.6rem;height:3.6rem;border-radius:8px;background:rgb(var(--color-background));box-shadow:0 1px 4px #0000002e;opacity:.9;pointer-events:none}.variant-gallery__thumbs .splide__slide{cursor:pointer;border:none!important;border-radius:8px!important;overflow:hidden;opacity:.7;background:rgb(var(--color-background));transition:opacity .15s ease,border-color .15s ease}.variant-gallery__thumbs .splide__slide:hover{opacity:1}.variant-gallery__thumbs .splide__slide.is-active{opacity:1;border-color:rgb(var(--color-foreground));border-width:2px}.variant-gallery__thumb-image{width:100%;height:100%;object-fit:contain;display:block;border-radius:8px}.variant-gallery .splide__arrow{background:#d1e030;opacity:1;width:4.8rem;height:4.8rem}.variant-gallery .splide__arrow svg{width:20px;height:20px}.splide__track--nav>.splide__list>.splide__slide.is-active{border:1px solid #2B2B2B!important;border-radius:8px!important}.variant-gallery .splide__arrow svg{fill:rgb(var(--color-foreground))}.variant-gallery__lens{display:none;position:absolute;pointer-events:none;border-radius:var(--media-radius, 0);background-repeat:no-repeat;z-index:5;box-shadow:inset 0 0 0 1px rgba(var(--color-foreground),.08)}.variant-gallery__modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center}.variant-gallery__modal[hidden]{display:none}.variant-gallery__modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000d9}.variant-gallery__modal-content{position:relative;width:100vw;height:100vh;display:flex;overflow:hidden;touch-action:none;-webkit-backdrop-filter:invert(20%);backdrop-filter:invert(20%)}.variant-gallery__modal-image{max-width:92vw;max-height:92vh;width:auto;height:auto;object-fit:contain;margin:auto;background:rgb(var(--color-background));transition:transform .05s linear;will-change:transform;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.variant-gallery__modal-close{all:unset;position:fixed;top:1.6rem;right:1.6rem;z-index:10001;display:flex;align-items:center;justify-content:center;width:4rem;height:4rem;border-radius:50%;background:rgb(var(--color-background));cursor:pointer;box-shadow:0 1px 6px #0000004d}.variant-gallery__modal-nav{all:unset;position:fixed;top:50%;transform:translateY(-50%);z-index:10001;display:flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;border-radius:50%;background:rgb(var(--color-background));cursor:pointer;box-shadow:0 1px 6px #0000004d}.variant-gallery__modal-nav--prev{left:1.6rem}.variant-gallery__modal-nav--next{right:1.6rem}@media screen and (min-width:990px)and (pointer:fine){.variant-gallery.is-zooming .variant-gallery__lens{display:block}}@media screen and (min-width:749px)and (max-width:1200px){.variant-gallery .splide__arrow{width:3rem;height:3rem}}@media screen and (max-width:749px){.variant-gallery{gap:.8rem}.variant-gallery .splide__arrow{width:2.8rem;height:2.8rem}.variant-gallery__main,.variant-gallery__zoom-trigger,.variant-gallery__image,.variant-gallery__thumb-image{border-radius:4px}.variant-gallery__zoom-icon{width:2.4rem;height:2.4rem;border-radius:4px}.variant-gallery__zoom-icon svg{width:12px;height:12px}.variant-gallery__thumbs .splide__slide,.splide__track--nav>.splide__list>.splide__slide.is-active{border-radius:4px!important}.variant-gallery__modal-nav{width:3.6rem;height:3.6rem}.variant-gallery__modal-nav--prev{left:.8rem}.variant-gallery__modal-nav--next{right:.8rem}.variant-gallery .splide__arrow svg{width:10px;height:10px}}
/*# sourceMappingURL=/cdn/shop/t/30/assets/variant-splide-gallery.css.map */