.dialog-modal,.dialog-drawer{--dialog-animation-speed: var(--duration-default);--dialog-animation-easing: ease;--dialog-width: 45rem;--dialog-shadow: 0 0 1.6rem rgba(var(--color-foreground), .1)}.dialog-modal{border:none;padding:0;max-width:calc(100% - var(--page-width-padding));box-shadow:var(--dialog-shadow);background:rgb(var(--color-background));color:rgb(var(--color-foreground))}@media screen and (max-width:749px){.dialog-modal{max-width:calc(100% - 1.6rem)}}@media screen and (min-width:750px){.dialog-modal{border-radius:var(--popup-corner-radius);width:calc(var(--dialog-width) + 1rem)}}.dialog-modal::backdrop{background:#00000020;-webkit-backdrop-filter:brightness(1);backdrop-filter:brightness(1);transition:backdrop-filter var(--dialog-animation-speed) var(--dialog-animation-easing)}.dialog-modal[open]{animation:dialogSlideInTop var(--dialog-animation-speed) var(--dialog-animation-easing) forwards}.dialog-modal[open]::backdrop{animation:dialogBackdropIn var(--dialog-animation-speed) var(--dialog-animation-easing) forwards;transition:opacity var(--dialog-animation-speed) var(--dialog-animation-easing)}.dialog-modal[open]:has(.dialog-header,.dialog-content){display:flex;flex-direction:column}.dialog-modal.dialog-closing{animation:dialogSlideOutTop var(--dialog-animation-speed) var(--dialog-animation-easing) forwards}.dialog-modal.dialog-closing::backdrop{opacity:0}.dialog-drawer[open]{--start-x: var(--custom-transform-from, 100%);--end-x: var(--custom-transform-to, 0px);--start-y: var(--custom-transform-y-from, 0);--end-y: var(--custom-transform-y-to, 0);--start-opacity: 1;animation:dialogMoveAndFade var(--dialog-animation-speed) var(--dialog-animation-easing) forwards}.dialog-drawer[open].dialog-closing{--start-x: 0px;--end-x: 100%;--start-opacity: 1;--end-opacity: 1;animation:dialogMoveAndFade var(--dialog-animation-speed) var(--dialog-animation-easing)}.dialog-drawer--right[open]{--start-x: -100%;--start-opacity: 1}.dialog-drawer--right[open].dialog-closing{--start-x: 0px;--end-x: -100%;--start-opacity: 1;--end-opacity: 1;animation:dialogMoveAndFade var(--dialog-animation-speed) var(--dialog-animation-easing)}.dialog-drawer{width:40rem;max-width:80%;height:100%;max-height:none;margin:0 0 0 auto}.dialog-drawer--right{margin:0 auto 0 0}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:1.6rem;overflow:hidden;position:sticky;top:0;z-index:2;background-color:rgb(var(--color-background))}.dialog-header>:not(.dialog-close){margin:0}.dialog-close,button.dialog-close{display:flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;margin:calc(-1 * (4.4rem - 1.5rem) / 2);background:transparent;border:none;cursor:pointer;outline:none;color:currentColor}.dialog-close svg{width:1.5rem;height:1.5rem}.dialog-content{padding:0rem 1.6rem 3.2rem;flex:1 1 0}@keyframes dialogMoveAndFade{0%{transform:translate(var(--start-x, 0),var(--start-y, 0));opacity:var(--start-opacity, 0)}to{transform:translate(var(--end-x, 0),var(--end-y, 0));opacity:var(--end-opacity, 1)}}@keyframes dialogSlideInTop{0%{transform:translateY(1rem);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes dialogSlideOutTop{0%{transform:translateY(0);opacity:1}to{transform:translateY(1rem);opacity:0}}@keyframes dialogBackdropIn{0%{-webkit-backdrop-filter:brightness(1);backdrop-filter:brightness(1)}to{-webkit-backdrop-filter:brightness(.75);backdrop-filter:brightness(.75)}}@media(prefers-reduced-motion:reduce){.dialog-modal[open],.dialog-modal.dialog-closing,.dialog-drawer[open],.dialog-drawer[open].dialog-closing,.dialog-modal[open]::backdrop{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/11/assets/component-dialog.css.map */
