.modal-wrapper{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center}.modal-wrapper.hidden{display:none}.modal__overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:rgba(var(--color-foreground),.5);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity var(--duration-default)}.modal{position:relative;z-index:2;width:90%;max-width:800px;max-height:85vh;background:rgb(var(--color-background));border-radius:var(--content-container-radius, 12px);box-shadow:0 25px 50px -12px #00000040;overflow:hidden;opacity:0;transform:scale(.95) translateY(10px);transition:opacity var(--duration-default),transform var(--duration-default)}.modal-wrapper:not(.hidden) .modal{opacity:1;transform:scale(1) translateY(0)}.modal:focus{outline:none}.modal__close{position:absolute;top:1rem;right:1rem;z-index:10;width:3.6rem;height:3.6rem;background:rgb(var(--color-background));border:1px solid rgba(var(--color-foreground),.1);border-radius:50%;cursor:pointer;color:rgb(var(--color-foreground));transition:background-color var(--duration-default),transform var(--duration-fast)}.modal__close:hover{background:rgba(var(--color-foreground),.05);transform:scale(1.05)}.modal__close:active{transform:scale(.95)}.modal__close .icon{width:2rem;height:2rem}.modal__content{padding:2.5rem;overflow-y:auto;max-height:85vh;-webkit-overflow-scrolling:touch}.modal__content::-webkit-scrollbar{width:8px}.modal__content::-webkit-scrollbar-track{background:rgba(var(--color-foreground),.05)}.modal__content::-webkit-scrollbar-thumb{background:rgba(var(--color-foreground),.2);border-radius:4px}.modal__content::-webkit-scrollbar-thumb:hover{background:rgba(var(--color-foreground),.3)}body.modal-open{overflow:hidden}@media screen and (max-width:749px){.modal{width:95%;max-height:90vh}.modal__content{padding:2rem 1.5rem;max-height:90vh}.modal__close{top:.8rem;right:.8rem;width:3.2rem;height:3.2rem}.modal__close .icon{width:1.8rem;height:1.8rem}}.modal,.modal__overlay{will-change:opacity,transform}.modal-wrapper.hidden .modal,.modal-wrapper.hidden .modal__overlay{will-change:auto}@media(prefers-reduced-motion:reduce){.modal,.modal__overlay{transition:none}.modal-wrapper:not(.hidden) .modal{transform:scale(1) translateY(0)}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/component-modal.css.map */