.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:1rem}.modal[hidden]{display:none}.modal__backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:modal-backdrop-in .2s ease}.modal__container{position:relative;z-index:1;width:100%;max-height:calc(100vh - 2rem);animation:modal-slide-in .3s ease}.modal__container--small{max-width:400px}.modal__container--medium{max-width:560px}.modal__container--large{max-width:800px}.modal__container--full{max-width:calc(100vw - 2rem);max-height:calc(100vh - 2rem)}.modal__panel{display:flex;flex-direction:column;max-height:calc(100vh - 2rem);background:#fff;border-radius:.75rem;box-shadow:0 25px 50px -12px #00000040;overflow:hidden}.modal__header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--color-border, #e2e8f0)}.modal__title{margin:0;font-size:1.125rem;font-weight:600;color:var(--color-text, #0f172a)}.modal__close{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;margin:-.25rem -.5rem -.25rem 0;padding:0;background:transparent;border:none;border-radius:.375rem;color:var(--color-text-muted, #64748b);cursor:pointer;transition:all .2s}.modal__close:hover{background:var(--color-background-subtle, #f1f5f9);color:var(--color-text, #0f172a)}.modal__close:focus-visible{outline:2px solid var(--color-primary, #0071dc);outline-offset:2px}.modal__body{flex:1;padding:1.5rem;overflow-y:auto}.modal__footer{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;padding:1rem 1.5rem;border-top:1px solid var(--color-border, #e2e8f0);background:var(--color-background-subtle, #f8fafc)}@keyframes modal-backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes modal-slide-in{0%{opacity:0;transform:scale(.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal[data-closing] .modal__backdrop{animation:modal-backdrop-out .2s ease forwards}.modal[data-closing] .modal__container{animation:modal-slide-out .2s ease forwards}@keyframes modal-backdrop-out{to{opacity:0}}@keyframes modal-slide-out{to{opacity:0;transform:scale(.95) translateY(-10px)}}body.modal-open{overflow:hidden}
/*# sourceMappingURL=/cdn/shop/t/9/assets/component-modal.css.map */