.variant-quick-add{display:flex;flex-direction:column-reverse;align-items:stretch;gap:.5rem;width:100%}.variant-quick-add__swatches{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;opacity:0;max-height:0;overflow:hidden;padding:0;transition:opacity var(--duration-default) ease,max-height var(--duration-default) ease}.variant-quick-add__swatch{display:inline-flex;align-items:center;justify-content:center;min-width:3.4rem;height:3.2rem;padding:.4rem 1rem;font-size:1.3rem;font-weight:600;line-height:1;letter-spacing:.03rem;text-transform:uppercase;color:rgb(var(--color-foreground));background-color:rgb(var(--color-background));border:.15rem solid rgb(var(--color-border));border-radius:min(var(--button-radius),.4rem);cursor:pointer;transition:all var(--duration-short) ease;white-space:nowrap}.variant-quick-add__swatch span{display:block;max-width:6rem;overflow:hidden;text-overflow:ellipsis}@media screen and (hover: hover){.variant-quick-add__swatch:not(.is-unavailable):hover{border-color:rgb(var(--color-foreground));background-color:rgba(var(--color-foreground),.05)}}.variant-quick-add__swatch.is-selected{background-color:rgb(var(--color-foreground));color:rgb(var(--color-background));border-color:rgb(var(--color-foreground))}.variant-quick-add__swatch.is-active{transform:scale(.95)}.variant-quick-add__swatch.is-unavailable{opacity:.4;cursor:not-allowed;text-decoration:line-through}.variant-quick-add__more{display:inline-flex;align-items:center;justify-content:center;min-width:3rem;height:3.2rem;padding:.4rem .6rem;font-size:1.2rem;font-weight:600;color:rgba(var(--color-foreground),.7);background:transparent;border:.15rem dashed rgb(var(--color-border));border-radius:min(var(--button-radius),.4rem);text-decoration:none;transition:all var(--duration-short) ease}.variant-quick-add__more:hover{color:rgb(var(--color-foreground));border-color:rgb(var(--color-foreground));border-style:solid}.variant-quick-add__button{width:100%;justify-content:center}.variant-quick-add__button-text{display:inline}@media screen and (min-width: 750px) and (hover: hover){.card-information__button:has(.variant-quick-add){height:auto;min-height:4rem}.card-information__button .variant-quick-add{transform:translateY(100%);opacity:0;transition:transform var(--duration-default) ease,opacity var(--duration-default) ease}.card-wrapper:hover .card-information__button .variant-quick-add{transform:translateY(0);opacity:1}.card-wrapper:hover .variant-quick-add__swatches{opacity:1;max-height:12rem;padding-bottom:.5rem;overflow:visible}.variant-quick-add .variant-quick-add__button.button{transform:none!important;opacity:1!important}}@media screen and (max-width: 749px),screen and (hover: none){.variant-quick-add{flex-direction:row;align-items:center;justify-content:flex-end;gap:.6rem;width:auto}.variant-quick-add__swatches{opacity:1;max-height:none;overflow:visible;flex-wrap:nowrap;justify-content:flex-end;gap:.4rem;flex:0 1 auto;order:1}.variant-quick-add__swatch{min-width:2.8rem;height:2.8rem;padding:.3rem .6rem;font-size:1.1rem;border-width:.12rem}.variant-quick-add__swatch span{max-width:4rem}.variant-quick-add__more{min-width:2.6rem;height:2.8rem;padding:.3rem .5rem;font-size:1rem}.variant-quick-add .variant-quick-add__button.button{order:2;flex:0 0 auto;width:4rem;height:4rem;min-width:4rem;min-height:4rem;padding:0;border-radius:50%;box-shadow:0 .3rem 1.2rem rgba(var(--color-foreground),.18);display:flex;align-items:center;justify-content:center}.variant-quick-add__button-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.variant-quick-add .variant-quick-add__button .icon{display:block!important;width:1.8rem;height:1.8rem}.card-information__button .variant-quick-add{opacity:1;transform:none}}@media screen and (max-width: 749px){.flex-grid--2-col-mobile .variant-quick-add__swatch{min-width:2.4rem;height:2.4rem;padding:.2rem .45rem;font-size:.95rem}.flex-grid--2-col-mobile .variant-quick-add__swatch span{max-width:3rem}.flex-grid--2-col-mobile .variant-quick-add .variant-quick-add__button.button{width:3.4rem;height:3.4rem;min-width:3.4rem;min-height:3.4rem}.flex-grid--2-col-mobile .variant-quick-add .variant-quick-add__button .icon{width:1.5rem;height:1.5rem}}.card-information__button .variant-quick-add,.card-information__button .variant-quick-add__swatches,.card-information__button .variant-quick-add__swatch{pointer-events:auto}.card-information__button:has(.variant-quick-add),.card-information,.card-wrapper:has(.variant-quick-add){overflow:visible}.variant-quick-add__swatch.loading{color:transparent;pointer-events:none;position:relative}.variant-quick-add__swatch.loading:after{content:"";position:absolute;width:1.2rem;height:1.2rem;border:.15rem solid transparent;border-top-color:rgb(var(--color-foreground));border-radius:50%;animation:vqa-spin .6s linear infinite}@keyframes vqa-spin{to{transform:rotate(360deg)}}.variant-quick-add__swatch:focus-visible,.variant-quick-add__button:focus-visible{outline:.2rem solid rgb(var(--color-foreground));outline-offset:.2rem}
/*# sourceMappingURL=/cdn/shop/t/91/assets/component-variant-quick-add.css.map */