.card__swatches{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin:.3rem 0 1rem}.card__swatch{display:inline-flex;line-height:0;border-radius:.3rem;position:relative;z-index:2;transition:transform .12s ease}.card__swatch .swatch{width:4rem;height:2rem;border-radius:.3rem;border:.1rem solid rgba(var(--color-foreground),.2);background:var(--swatch--background) center center / cover no-repeat}.card__swatch:hover{transform:scale(1.05)}.card__swatch:hover .swatch{box-shadow:0 0 0 .2rem rgb(var(--color-background)),0 0 0 .3rem rgba(var(--color-foreground),.4)}.card__swatch[aria-current=true] .swatch{box-shadow:0 0 0 .2rem rgb(var(--color-background)),0 0 0 .34rem rgba(var(--color-foreground),.9)}.card__swatch[data-available=false] .swatch{position:relative;overflow:hidden;opacity:.55}.card__swatch[data-available=false] .swatch:after{content:"";position:absolute;left:-15%;right:-15%;top:50%;border-top:.1rem solid rgba(var(--color-foreground),.55);transform:rotate(-27deg)}.card:not(.card--horizontal)>.card__content .quick-add{grid-row:2;align-self:end;justify-self:end;margin:0 .8rem 1.1rem 0;width:auto;z-index:2}.card:not(.card--horizontal)>.card__content .quick-add__submit{min-width:0;width:auto;min-height:3.6rem;padding:0 1.8rem;border-radius:5rem;font-size:1.1rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;--color-button: 18, 18, 18;--color-button-text: 255, 255, 255;--alpha-button-background: 1;--alpha-button-border: 0}.card:not(.card--horizontal)>.card__content .quick-add__submit:before,.card:not(.card--horizontal)>.card__content .quick-add__submit:after{border-radius:5rem}.card:not(.card--horizontal)>.card__content:has(.quick-add) .card-information{padding-right:12.5rem}@media screen and (max-width:749px){.card:not(.card--horizontal)>.card__content .quick-add{grid-row:4;align-self:auto;justify-self:stretch;margin:0 0 1rem}.card:not(.card--horizontal)>.card__content .quick-add__submit{width:100%;min-height:3.4rem;padding:0 1rem;font-size:1rem}.card:not(.card--horizontal)>.card__content:has(.quick-add) .card-information{padding-right:0}.card__swatch .swatch{width:3.6rem;height:1.8rem}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/component-card-cc.css.map */