.\#modal-popup{--position-x: center;--position-y: center;--transition: .5s;position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;pointer-events:none;display:none}.\#modal-popup-layout{width:100%;height:100%;display:flex;align-items:var(--position-y);justify-content:var(--position-x);position:relative;z-index:3;pointer-events:none}.\#modal-popup-backdrop{top:0;left:0;width:100%;height:100%;position:absolute;z-index:1;background:#000c;opacity:0;transition:var(--transition);pointer-events:auto}.\#modal-popup-content{pointer-events:auto;transition:var(--transition);height:fit-content}.\#modal-popup-close{position:absolute;top:1rem;right:1rem;color:#fff;font-size:1.7rem;background:none;border:none;pointer-events:auto;opacity:0;transition:var(--transition);cursor:pointer}.\#modal-popup-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;display:none}.\#modal-popup-loading .\#spinner{--color: var(--color-g-fg)}.\#modal-popup[opened],.\#modal-popup[loading] .\#modal-popup-loading{display:block}.\#modal-popup.\@load .\#modal-popup-backdrop,.\#modal-popup.\@load .\#modal-popup-close{opacity:1}.\#modal-popup[animation=fade] .\#modal-popup-content{opacity:0}.\#modal-popup[animation=fade].\@animate .\#modal-popup-content{opacity:1}.\#modal-popup[animation=top] .\#modal-popup-content{opacity:0;transform:translateY(-100px)}.\#modal-popup[animation=top].\@animate .\#modal-popup-content{opacity:1;transform:translateY(0)}.\#modal-popup[animation=bottom] .\#modal-popup-content{opacity:0;transform:translateY(100%)}.\#modal-popup[animation=bottom].\@animate .\#modal-popup-content{opacity:1;transform:translateY(0)}.\#modal-popup[animation=left] .\#modal-popup-content{transform:translate(-100%)}.\#modal-popup[animation=left].\@animate .\#modal-popup-content{transform:translate(0)}.\#modal-popup[animation=right] .\#modal-popup-content{transform:translate(100%)}.\#modal-popup[animation=right].\@animate .\#modal-popup-content{transform:translate(0)}.\#modal-popup[animation=zoom] .\#modal-popup-content{opacity:0;transform:scale(.5)}.\#modal-popup[animation=zoom].\@animate .\#modal-popup-content{opacity:1;transform:scale(1)}.\#modal-popup-back{display:flex;align-items:center;gap:.33rem;color:var(--color-g-fg);font-weight:var(--font-body-weight-bold);margin-bottom:.5rem;cursor:pointer}.\#modal-popup-back .\#icon{--size: 1.125rem}
/*# sourceMappingURL=/cdn/shop/t/43/assets/modal.css.map */
