quick-add-variants{position:relative;z-index:2;display:block;margin-top:-1.7rem;margin-bottom:.6rem;padding:0 .6rem;container-type:inline-size;pointer-events:none}.quick-add-variants__row{display:flex;flex-wrap:nowrap;gap:.6rem;justify-content:flex-start;align-items:center;overflow-x:auto;overflow-y:visible;scroll-snap-type:x proximity;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;pointer-events:auto;mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 1.6rem),transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 1.6rem),transparent 100%);padding:.2rem 1.6rem .2rem .2rem}.quick-add-variants__row::-webkit-scrollbar{display:none}.quick-add-variants--single{display:flex;justify-content:flex-end;padding-right:.8rem}.quick-add-variants--single .quick-add-variants__bubble{pointer-events:auto}.quick-add-variants__pill,.quick-add-variants__bubble{--qav-bg: rgba(18, 18, 18, .96);--qav-fg: #fff;--qav-border: rgba(255, 255, 255, .55);--qav-border-hover: #fff;--qav-border-width: 1px;appearance:none;-webkit-appearance:none;font-family:inherit;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--qav-fg);background:var(--qav-bg);border:var(--qav-border-width) solid var(--qav-border);cursor:pointer;transition:transform .14s ease,border-color .14s ease,background-color .14s ease,color .14s ease,box-shadow .14s ease;backdrop-filter:saturate(140%) blur(6px);-webkit-backdrop-filter:saturate(140%) blur(6px);position:relative;isolation:isolate;flex:0 0 auto;scroll-snap-align:start;box-shadow:0 6px 16px -8px #00000073}.quick-add-variants__pill{min-width:4.4rem;height:3.4rem;padding:0 1.2rem;border-radius:999px;font-size:1.15rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}.quick-add-variants__bubble{width:3.6rem;height:3.6rem;padding:0;border-radius:999px;display:inline-flex;align-items:center;justify-content:center}.quick-add-variants__bubble-icon{width:1.5rem;height:1.5rem;display:block;color:currentColor;pointer-events:none}.quick-add-variants__pill-label{display:inline-block;pointer-events:none;transform:translateY(.05em)}.quick-add-variants__pill:hover:not([disabled]),.quick-add-variants__bubble:hover:not([disabled]),.quick-add-variants__pill:focus-visible,.quick-add-variants__bubble:focus-visible{border-color:var(--qav-border-hover);box-shadow:0 0 0 1px #fff3,0 6px 16px -6px #00000080;outline:none}.quick-add-variants__pill:active:not([disabled]),.quick-add-variants__bubble:active:not([disabled]){transform:scale(.96)}.quick-add-variants__pill[data-loading=true],.quick-add-variants__bubble[data-loading=true]{color:transparent;pointer-events:none}.quick-add-variants__pill[data-loading=true]:after,.quick-add-variants__bubble[data-loading=true]:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:1.4rem;height:1.4rem;border-radius:999px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:quickAddVariantsSpin .6s linear infinite}@keyframes quickAddVariantsSpin{to{transform:rotate(360deg)}}.quick-add-variants__pill[data-success=true],.quick-add-variants__bubble[data-success=true]{background:#fff;color:#111;border-color:#fff}.quick-add-variants__pill[data-success=true] .quick-add-variants__pill-label,.quick-add-variants__bubble[data-success=true] .quick-add-variants__bubble-icon{opacity:0}.quick-add-variants__pill[data-success=true]:before,.quick-add-variants__bubble[data-success=true]:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:1.4rem;height:.7rem;border-left:2px solid #111;border-bottom:2px solid #111;transform:rotate(-45deg) translateY(-.15rem)}.quick-add-variants__pill--soldout,.quick-add-variants__pill[disabled],.quick-add-variants__bubble[disabled]{cursor:not-allowed;opacity:.42}.quick-add-variants__pill--soldout .quick-add-variants__pill-label{text-decoration:line-through;text-decoration-thickness:1px}.quick-add-variants__pill[data-error=true],.quick-add-variants__bubble[data-error=true]{border-color:#ff5a5a;animation:quickAddVariantsShake .34s ease}@keyframes quickAddVariantsShake{0%,to{transform:translate(0)}20%{transform:translate(-3px)}40%{transform:translate(3px)}60%{transform:translate(-2px)}80%{transform:translate(2px)}}.quick-add-variants__status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@container (max-width: 240px){quick-add-variants{margin-top:-1.5rem;padding:0 .3rem}.quick-add-variants__pill{min-width:3.8rem;height:3rem;padding:0 1rem;font-size:1.05rem}.quick-add-variants__bubble{width:3.2rem;height:3.2rem}}
/*# sourceMappingURL=/cdn/shop/t/21/assets/quick-add-variants.css.map */