:root{--dialog-component-backdrop-opacity: 1;--dialog-component-backdrop-blur: 5px}dialog-component:not(:defined){display:none}dialog-component .dialog{background-color:transparent;width:100%;height:100%;border:none;padding:0;margin:0;max-width:100%;max-height:100%;overflow:hidden}dialog-component .dialog::backdrop{background:#00000080;transition:opacity .2s,backdrop-filter .2s;opacity:var(--dialog-component-backdrop-opacity, 1);-webkit-backdrop-filter:blur(var(--dialog-component-backdrop-blur));backdrop-filter:blur(var(--dialog-component-backdrop-blur));will-change:opacity,backdrop-filter}dialog-component .dialog:focus{outline:none}dialog-component .dialog[open]{display:flex;align-items:center;justify-content:center}dialog-component .dialogInner{max-width:640px;width:100%;background:#fff;padding:30px;border-radius:20px;margin:0 20px;position:relative;max-height:calc(100dvh - 60px);will-change:transform}dialog-component .dialogCloseButton{-webkit-appearance:none;appearance:none;background:none;border:none;position:absolute;right:30px;top:31px;cursor:pointer;width:18px;height:18px;padding:0;transition:.3s ease;z-index:2;display:flex}dialog-component .dialogCloseButton svg{width:100%;height:auto}dialog-component .dialogCloseButton:hover{color:#666}dialog-component .dialogDragBar{display:none;height:40px;width:100%;position:absolute;left:0;top:0;padding:16px 0;-webkit-tap-highlight-color:transparent}dialog-component .dialogDragBar:focus,dialog-component .dialogDragBar:focus-visible{outline:none}dialog-component .dialogDragBar:after{content:"";display:block;height:4px;width:60px;background-color:#ccc;border-radius:50px;position:absolute;left:50%;transform:translate(-50%)}dialog-component .dialogLoading{position:absolute;background-color:#fff;height:100%;width:100%;left:0;top:0;z-index:99;display:none;align-items:center;justify-content:center;opacity:.75;border-radius:10px}dialog-component .dialogLoading.active{display:flex}dialog-component .dialogLoadingSpinner{position:relative}dialog-component .dialogLoadingSpinner:after{content:"";position:absolute;width:30px;height:30px;top:0;left:0;right:0;bottom:0;margin:auto;border:2px solid transparent;border-radius:50%;animation:dialogLoadingSpinnerAnimation 1s ease infinite;border-top-color:#000}@keyframes dialogLoadingSpinnerAnimation{0%{transform:rotate(0)}to{transform:rotate(1turn)}}dialog-component .dialogContent{display:flex;flex-direction:column;height:100%}@media (min-width: 491px){dialog-component .dialog.open .dialogInner{opacity:1}dialog-component .dialogInner{opacity:0;transition:transform .25s ease-out,opacity .25s ease-out}}@media (max-width: 490px){dialog-component .dialog{transform:translateY(100%);will-change:transform}dialog-component .dialog[open]{align-items:end;transition:transform .5s ease-in-out}dialog-component .dialog.open{transform:translateY(0)}dialog-component .dialogDragBar{display:block}dialog-component .dialogCloseButton{right:20px;top:41px}dialog-component .dialogInner{max-width:100%;border-radius:20px 20px 0 0;margin:0;padding:40px 20px 20px}}
/*# sourceMappingURL=/cdn/shop/t/26/assets/component-dialog.css.map */