:where(dialog.drawer){border:0;background:var(--color-background);box-shadow:var(--shadow-drawer)}dialog.drawer{--drawer-width: 420px;--drawer-inset: var(--lg-float-inset, 0px);position:fixed;top:var(--drawer-inset);bottom:var(--drawer-inset);width:min(var(--drawer-width),calc(100vw - 2 * var(--drawer-inset)));max-width:calc(100vw - 2 * var(--drawer-inset));height:calc(100% - 2 * var(--drawer-inset));max-height:calc(100dvh - 2 * var(--drawer-inset));margin:0;padding:0;border-radius:var(--lg-radius-sheet, 0);overflow:hidden;color:var(--color-text);font-family:var(--font-body-family);font-size:16px;line-height:1.5}dialog.drawer--left{left:var(--drawer-inset);right:auto}dialog.drawer--right{left:auto;right:var(--drawer-inset)}dialog.drawer::backdrop{background:rgba(var(--color-ink-rgb, 8, 28, 45),.55)}@media(prefers-reduced-motion:no-preference){dialog.drawer--left[open]{animation:drawer-in-left var(--lg-dur-sheet, .34s) var(--lg-ease-glass, var(--ease-out, ease-out))}dialog.drawer--right[open]{animation:drawer-in-right var(--lg-dur-sheet, .34s) var(--lg-ease-glass, var(--ease-out, ease-out))}dialog.drawer--left[data-closing]{animation:drawer-out-left .22s ease-in forwards}dialog.drawer--right[data-closing]{animation:drawer-out-right .22s ease-in forwards}dialog.drawer[open]::backdrop{animation:backdrop-in var(--lg-dur-sheet, .34s) ease-out}dialog.drawer[data-closing]::backdrop{animation:backdrop-out .22s ease-in forwards}}@keyframes drawer-in-left{0%{transform:translate(calc(-100% - var(--drawer-inset, 0px)))}}@keyframes drawer-in-right{0%{transform:translate(calc(100% + var(--drawer-inset, 0px)))}}@keyframes drawer-out-left{to{transform:translate(calc(-100% - var(--drawer-inset, 0px)))}}@keyframes drawer-out-right{to{transform:translate(calc(100% + var(--drawer-inset, 0px)))}}@keyframes backdrop-in{0%{opacity:0}}@keyframes backdrop-out{to{opacity:0}}.drawer__inner{display:flex;flex-direction:column;height:100%;min-height:0}.drawer__header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;min-height:64px;padding:10px 12px 10px 20px;background:transparent;box-shadow:inset 0 -1px rgba(var(--color-ink-rgb, 8, 28, 45),.1)}.drawer__title{margin:0;font-family:var(--font-heading-family);font-weight:var(--font-heading-weight);font-size:20px;line-height:1.2;color:var(--color-text)}.drawer__close{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;padding:0;border:0;border-radius:var(--radius-pill);background:transparent;color:var(--color-ink);cursor:pointer;transition:background-color var(--lg-dur-hover, .16s) var(--lg-ease-glass, ease),transform var(--lg-dur-press, .1s) var(--lg-ease-spring, ease)}.drawer__close:hover{background:var(--lg-fill-ink-06, var(--color-surface-2))}.drawer__close:active{background:var(--lg-fill-ink-10, var(--color-surface-2));transform:scale(var(--lg-press-scale, .97))}.drawer__footer{flex-shrink:0;padding:16px 20px 20px;background:var(--lg-fill-white-90, var(--color-background));box-shadow:inset 0 1px rgba(var(--color-ink-rgb, 8, 28, 45),.1)}@media(prefers-reduced-transparency:reduce){.drawer__footer{background:#fff}}@media(prefers-contrast:more){.drawer__header{box-shadow:inset 0 -1px 0 var(--color-ink)}.drawer__footer{background:#fff;box-shadow:inset 0 1px 0 var(--color-ink)}}@media(forced-colors:active){.drawer__header{border-bottom:1px solid CanvasText}.drawer__footer{border-top:1px solid CanvasText}}
/*# sourceMappingURL=/cdn/shop/t/18/assets/component-drawer.css.map */
