.image-popup-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.image-popup-modal[open]{opacity:1;visibility:visible}.image-popup-modal__overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;box-sizing:border-box}.image-popup-modal__close-container{position:absolute;top:2rem;right:2rem;z-index:100}.image-popup-modal__close{background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;width:4rem;height:4rem;transition:all .2s ease}.image-popup-modal__close:hover{transform:scale(1.05)}.image-popup-modal__close svg{width:100%;height:100%}.image-popup-modal__content{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#b79de0;overflow:hidden;width:100%;height:100%;padding:2rem;box-sizing:border-box}.image-popup-modal__image-container{position:relative;max-width:100%;display:flex;align-items:center;justify-content:center}.image-popup-modal__thumbnails{margin-top:2rem;margin-bottom:2rem;border-radius:.8rem;max-width:100%}.image-popup-modal__thumbnails.hidden{display:none}.image-popup-modal__thumbnails-container{display:flex;gap:.5rem;max-width:500px;overflow-x:auto}.image-popup-modal__thumbnail{flex-shrink:1;border-radius:8px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:border-color .2s ease}.image-popup-modal__thumbnail.active{border-color:rgb(var(--color-foreground))}.image-popup-modal__thumbnail img{max-width:15vw;min-width:40px;width:100%;object-fit:contain;display:block}.image-popup-modal__image{max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--media-radius, .8rem);box-shadow:0 2rem 4rem rgba(var(--color-foreground),.2);opacity:0;transition:opacity .3s ease;width:100%;height:100%}.image-popup-modal__image.loaded{opacity:1}.image-popup-modal__loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1}.image-popup-modal__loading.hidden{display:none}.image-popup-spinner{display:block;width:4rem;height:4rem;border:3px solid rgba(var(--color-foreground),.3);border-top:3px solid rgb(var(--color-foreground));border-radius:50%;animation:image-popup-spin 1s linear infinite}.image-popup-spinner.hidden{display:none}@keyframes image-popup-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}[data-img-action=popup]{cursor:pointer;transition:transform .2s ease,opacity .2s ease}[data-img-action=popup]:hover{transform:scale(1.02);opacity:.9}[data-img-action=gallery]{cursor:pointer;transition:transform .2s ease,opacity .2s ease}@media screen and (min-width: 750px){.image-popup-modal__content{position:relative;max-width:90vw;max-height:90vh;display:flex;align-items:center;justify-content:center;height:unset;width:600px;border-radius:15px;overflow:hidden;padding:0}}@media screen and (max-width: 749px){.image-popup-modal__close-container{top:15px;right:10px}.image-popup-modal__close{width:30px;height:30px}}body.image-popup-open{overflow:hidden}@media (prefers-contrast: high){.image-popup-modal__overlay{background-color:#000000e6}.image-popup-modal__close{border-color:rgb(var(--color-foreground))}}@media (prefers-reduced-motion: reduce){.image-popup-modal,.image-popup-modal__image,.image-popup-modal__close,.image-popup-trigger{transition:none}.spinner,.spinner .path{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/121/assets/component-image-popup.css.map */