.image-modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;display:none;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease-in-out}.image-modal.active{display:flex;opacity:1;animation:zoomIn .3s ease-out}.image-modal.closing{animation:zoomOut .3s ease-in}.image-modal__overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#0000;z-index:11;transition:background .3s ease-in-out}.image-modal.active .image-modal__overlay{background:#fffc}.image-modal__content{position:relative;width:100%;max-height:calc(100vh - 32px);z-index:11;display:flex;flex-direction:column;margin:16px;padding:0;transform:translateZ(0)}.image-modal__close{position:absolute;top:16px;right:28px;z-index:11;max-width:28px;max-height:28px;cursor:pointer;background:#ffffffe6;border:none;border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.image-modal__close:hover{background:#fff;transform:scale(1.1)}.image-modal__gallery{display:flex;flex-direction:column;height:100%;max-height:calc(100vh - 32px)}.image-modal__main-slider{position:relative;width:100%;max-width:95vw;max-height:calc(100vh - 200px);margin:0 auto}.image-modal__main-slider .slick-slide{display:flex;align-items:center;justify-content:center;padding:0 10px;height:100%;width:100%}.image-modal__main-slider .slick-slide>div{max-width:max(70vh,640px);width:100%;height:100%;display:flex;align-items:center;justify-content:center}.image-modal__main-slider img,.image-modal__main-slider video{width:100%;height:100%;object-fit:contain;border-radius:8px}.image-modal__main-slider .product-image__zoom{display:none!important}.image-modal__thumbnails{flex-shrink:0;max-width:max(70vh,640px);width:100%;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-scrollbar-width:none;padding:16px 0 0;margin:0 auto}.image-modal__thumbnails::-webkit-scrollbar{display:none}.image-modal__thumbnails .thumbnail-item{flex-shrink:0;max-width:100px;width:100%;border-radius:12px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:all .2s ease}.image-modal__thumbnails .thumbnail-item.active{border-color:#000}.image-modal__thumbnails .thumbnail-item img,.image-modal__thumbnails .thumbnail-item video{width:100%;height:100%;object-fit:cover}.image-modal__thumbnails.grabbing{cursor:grabbing!important;scroll-behavior:auto}.image-modal__main-slider .slick-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10002;border:2px solid #fff!important;background:#e9e9e9!important;box-shadow:0 0 18px #00000026!important;border-radius:50%;width:30px;height:30px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.image-modal__main-slider .slick-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.1)}.image-modal__main-slider .slick-prev{left:16px}.image-modal__main-slider .slick-next{right:16px}.image-modal__main-slider .slick-arrow svg{width:20px;height:20px}.image-modal__main-slider:has(.slick-slide[data-slick-index="0"].slick-active) .slick-prev,.image-modal__main-slider:has(.slick-slide:last-of-type:is(.slick-active)) .slick-next{opacity:0;pointer-events:none}@media (min-width: 768px){.image-modal__content{margin:24px;max-height:calc(100vh - 48px)}.image-modal__gallery{max-height:calc(100vh - 48px)}.image-modal__main-slider{max-width:90vw}.image-modal__main-slider .slick-arrow{width:50px;height:50px}.image-modal__main-slider .slick-slide{padding:0 20px}.image-modal__main-slider .slick-prev{left:-15px}.image-modal__main-slider .slick-next{right:-15px}.image-modal__close{top:16px;right:16px;width:40px;height:40px}}@media (min-width: 1024px){.image-modal__content{max-width:1024px;max-height:calc(100vh - 64px);margin:32px}.image-modal__gallery{max-height:calc(100vh - 64px)}.image-modal__main-slider{max-width:max(840px,70vh)}.image-modal__main-slider .slick-prev{left:-25px}.image-modal__main-slider .slick-next{right:-25px}}@media (min-width: 1280px){.image-modal__content{max-height:calc(100vh - 96px);margin:48px}.image-modal__gallery{max-height:calc(100vh - 96px)}}@keyframes zoomIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes zoomOut{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:0}}
/*# sourceMappingURL=/cdn/shop/t/13/assets/pdp-main-image-modal.css.map */