.drawer{border:none;padding:0;margin:0;background:transparent;max-width:none;max-height:none;width:100vw;height:100dvh;color:var(--color-foreground);overflow:visible}.drawer::backdrop{background-color:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);transition:background-color .3s ease,backdrop-filter .3s ease}.drawer.is-open::backdrop{background-color:#0003;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.drawer__panel{position:fixed;top:0;bottom:0;background-color:var(--color-background);display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:20px;transition:transform .3s cubic-bezier(.4,0,.2,1);will-change:transform}.drawer__panel:focus{outline:none}.drawer__header{position:relative;display:flex;justify-content:center;align-items:flex-start;margin-bottom:40px}.drawer__close{position:absolute;top:0;right:0;background:none;border:none;padding:0;margin:0;cursor:pointer;color:inherit;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;transition:opacity .15s ease}.drawer__close svg{width:100%;height:100%;display:block}@media(hover:hover){.drawer__close:hover{opacity:.6}}@media screen and (min-width:1024px){.drawer__header{margin-bottom:24px}}.drawer--left .drawer__panel{left:0;width:100vw;transform:translate(-100%);border-right:1px solid color-mix(in srgb,var(--color-foreground) 12%,transparent)}@media screen and (min-width:1024px){.drawer--left .drawer__panel{width:min(80vw,400px)}}.drawer--left.is-open .drawer__panel{transform:translate(0)}.drawer--right .drawer__panel{right:0;width:100vw;transform:translate(100%);box-shadow:-8px 0 40px -24px #0000004d}@media screen and (min-width:1024px){.drawer--right .drawer__panel{width:min(92vw,600px)}}.drawer--right.is-open .drawer__panel{transform:translate(0)}.drawer--top .drawer__panel{top:0;bottom:auto;left:0;right:0;width:100%;height:100dvh;max-height:100dvh;transform:translateY(-100%);padding:var(--page-margin);overflow-y:auto}.drawer--top.is-open .drawer__panel{transform:translateY(0)}@media screen and (min-width:1024px){.drawer--top .drawer__panel{padding:var(--page-margin);height:auto;max-height:90dvh}}.drawer--bottom .drawer__panel{left:0;right:0;bottom:0;top:auto;width:100%;max-height:85dvh;height:auto;background:var(--color-background, #fff);color:var(--color-foreground, #000);transform:translateY(100%);padding:20px}.drawer--bottom.is-open .drawer__panel{transform:translateY(0)}
/*# sourceMappingURL=/cdn/shop/t/220/assets/drawer.css.map */
