.variant-drawer-trigger{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;max-width:100%;min-width:0;padding:11px 14px;border:1px solid rgba(var(--text-color) / .2);border-radius:6px;background-color:transparent;color:inherit;font-size:inherit;cursor:pointer;text-align:left;transition:border-color .2s ease,background-color .15s ease;box-sizing:border-box;overflow:hidden}.variant-drawer-trigger:hover{border-color:rgba(var(--text-color) / .45);background-color:rgba(var(--text-color) / .03)}.variant-drawer-trigger:focus-visible{outline:2px solid rgba(var(--text-color) / .7);outline-offset:2px}.variant-drawer-trigger__preview{display:flex;align-items:center;gap:10px;flex:1;min-width:0;overflow:hidden}.variant-drawer-trigger__swatch{flex-shrink:0;width:22px;height:22px;border-radius:4px;border:1px solid rgba(var(--text-color) / .12);background-color:var(--swatch-color, rgba(var(--text-color) / .07));background-image:var(--swatch-image, none);background-size:cover;background-position:center;overflow:hidden;position:relative}.variant-drawer-trigger__swatch--image img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.variant-drawer-trigger__value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.variant-drawer-trigger__placeholder{opacity:.45}.variant-drawer-trigger__count{flex-shrink:0;display:inline-flex;align-items:center;padding:3px 9px;font-size:.75rem;font-weight:500;letter-spacing:.02em;line-height:1;color:rgba(var(--text-color) / .75);background-color:rgba(var(--text-color) / .06);border-radius:999px;white-space:nowrap;margin-left:auto;transition:background-color .15s ease,color .15s ease}.variant-drawer-trigger:hover .variant-drawer-trigger__count{background-color:rgba(var(--text-color) / .1);color:rgba(var(--text-color) / .9)}.variant-drawer-trigger__arrow{flex-shrink:0;display:flex;align-items:center;color:rgba(var(--text-color) / .45);transition:transform .2s ease}.variant-drawer-trigger__arrow svg{width:16px;height:16px}.zz-media-variant-badge{position:absolute;right:12px;bottom:12px;z-index:5;display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;background-color:rgb(var(--bg-color));color:rgb(var(--text-color));border:1px solid rgba(var(--text-color) / .12);border-radius:999px;font-size:.8125rem;font-weight:500;line-height:1;cursor:pointer;box-shadow:0 4px 14px #0000001a,0 1px 3px #0000000f;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .15s ease,box-shadow .15s ease;-webkit-tap-highlight-color:transparent}.zz-media-variant-badge:active{transform:scale(.97);box-shadow:0 2px 8px #00000014}.zz-media-variant-badge__count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;background-color:rgb(var(--text-color));color:rgb(var(--bg-color));border-radius:999px;font-size:.75rem;font-weight:600;letter-spacing:.01em}.zz-media-variant-badge__label{letter-spacing:.01em}@media(min-width:769px){.zz-media-variant-badge{display:none!important}}.variant-drawer__backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9998;background-color:rgba(var(--modal-overlay-color) / var(--modal-overlay-opacity, .4));opacity:0;pointer-events:none;transition:opacity .3s ease}.variant-drawer__backdrop.is-open{opacity:1;pointer-events:auto}.variant-drawer__panel{position:fixed;top:0;right:0;bottom:0;width:min(420px,88vw);z-index:9999;background-color:#fff;display:flex;flex-direction:column;transform:translate(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);box-shadow:-2px 0 32px #0000001a}.variant-drawer__panel.is-open{transform:translate(0)}.variant-drawer__header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid rgba(var(--text-color) / .1);flex-shrink:0}.variant-drawer__title{font-size:1.2em;font-weight:600;letter-spacing:.01em}.variant-drawer__close{display:flex;align-items:center;justify-content:center;width:36px!important;height:36px!important;min-width:unset!important;padding:0!important;border:1px solid rgba(var(--text-color) / .15)!important;border-radius:50%!important;background:transparent!important;cursor:pointer;color:inherit;flex-shrink:0;transition:background-color .15s ease,border-color .15s ease}.variant-drawer__close:hover{background-color:rgba(var(--text-color) / .06)!important;border-color:rgba(var(--text-color) / .3)!important}.variant-drawer__close svg{width:14px;height:14px}.variant-drawer__scroll{flex:1;overflow-y:auto;padding:12px 8px;overscroll-behavior:contain}.variant-drawer__options{flex-direction:column!important;flex-wrap:nowrap!important;gap:2px!important;padding:0}.variant-drawer__options .opt-label{width:100%!important;height:auto!important;min-height:64px;padding:10px 16px!important;border-radius:8px!important;display:flex!important;align-items:center;gap:16px;text-align:left;font-size:1.2rem;line-height:1.3;font-weight:400;background-color:transparent!important;background-image:none!important;border:none!important;box-shadow:none!important;transition:background-color .15s ease!important;cursor:pointer;-webkit-tap-highlight-color:transparent;--swatch-variant-picker-size: auto}@media(hover:hover)and (pointer:fine){.variant-drawer__options .opt-label:hover,.variant-drawer__options label[data-swatch]:hover{background-color:rgba(var(--text-color) / .05)!important;border:none!important;box-shadow:none!important}.variant-drawer__options .opt-label:hover:after{box-shadow:none!important}}@media(hover:none){.variant-drawer__options .opt-label:hover,.variant-drawer__options label[data-swatch]:hover{background-color:transparent!important;border:none!important;box-shadow:none!important}.variant-drawer__options .opt-label:hover:after{box-shadow:none!important}.variant-drawer__options .opt-label:active{background-color:rgba(var(--text-color) / .05)!important}}.variant-drawer__options .opt-label.is-selected{background-color:transparent!important;border:1.5px solid rgba(var(--text-color) / .55)!important;box-shadow:none!important;font-weight:600}.variant-drawer__options .opt-label .js-value{position:static!important;width:auto!important;height:auto!important;overflow:visible!important;clip:auto!important;clip-path:none!important;white-space:normal!important;flex:1}.variant-drawer__options .opt-label--swatch:before{content:"";flex-shrink:0;display:block;width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(var(--text-color) / .15);background-color:var(--swatch-color, rgba(var(--text-color) / .08));background-image:var(--swatch-image, none);background-size:cover;background-position:center}.variant-drawer__options .opt-label--image:before,.variant-drawer__options .swatch--native:before{display:none}.variant-drawer__options .opt-label--image{flex-direction:row-reverse!important;padding-top:0!important;padding-bottom:0!important;padding-left:0!important;overflow:hidden!important}.variant-drawer__options .opt-label--image .opt-label__media{width:64px!important;height:64px!important;padding-top:0!important;flex-shrink:0;align-self:center!important;border-radius:0!important;overflow:hidden;position:relative!important}.variant-drawer__options .opt-label--image .opt-label__media img{position:absolute!important;top:0!important;right:0!important;bottom:0!important;left:0!important;width:100%!important;height:100%!important;object-fit:cover!important}.variant-drawer__options .opt-label .opt-label__native-media{width:52px!important;height:52px!important;padding-top:0!important;flex-shrink:0;border-radius:6px;overflow:hidden;position:relative!important}.variant-drawer__options .opt-label.is-selected:after{display:none!important}.variant-drawer__options .opt-label.is-unavailable{opacity:.4}.variant-drawer__options .is-unavailable+.opt-label .opt-label__media:after,.variant-drawer__options .is-unavailable+.opt-label:not(.opt-label--image):before,.variant-drawer__options .is-unavailable+.opt-label:not(.opt-label--image):after,.variant-drawer__options .is-unavailable+.opt-label--swatch .opt-label__media:after,.variant-drawer__options .is-unavailable+.opt-label--swatch:not(.opt-label--image):after{display:none!important;background:none!important;content:none!important}.variant-drawer__options .is-unavailable+.opt-label:not(.opt-label--image){background:none!important;overflow:visible!important}.variant-drawer__options .is-unavailable+.opt-label--image img{opacity:1!important}.variant-drawer__options .opt-label.is-unavailable .opt-label__media:after{content:""!important;display:block!important;position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom left,transparent calc(50% - 1px),rgba(var(--text-color) / .2) calc(50% - 1px),rgba(var(--text-color) / .2) calc(50% + 1px),transparent calc(50% + 1px)) no-repeat!important}.variant-drawer__options .opt-label.is-unavailable.opt-label--image img{opacity:.4!important}body.variant-drawer-open{overflow:hidden;padding-right:var(--vd-scrollbar-width, 0px)}body.variant-drawer-open store-header,body.variant-drawer-open .header{z-index:auto!important}.option-selector[data-has-drawer]{border:none;padding:0;margin:0;min-width:0;max-width:100%;overflow:hidden}.variant-drawer-extra{margin-bottom:8px}
/*# sourceMappingURL=/cdn/shop/t/70/assets/zz-variant-drawer.css.map */