.swatch{--swatch--size: var(--swatch-input--size, 4.4rem);--swatch--border-radius: var(--swatch-input--border-radius, 50%);display:block;width:var(--swatch--size);max-width:100%;aspect-ratio:1 / 1;background:var(--swatch--background);background-position:var(--swatch-focal-point, initial);background-size:cover;background-origin:border-box;border:.1rem solid rgba(var(--color-foreground),.15);border-radius:var(--swatch--border-radius)}.swatch--square{--swatch--border-radius: var(--swatch-input--border-radius, .2rem)}.swatch--unavailable{border-style:dashed;border-color:rgba(var(--color-foreground),.5)}.ms-card-swatches{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;column-gap:var(--card-swatch-gap-x, .4rem);row-gap:var(--card-swatch-gap-y, .4rem);margin-top:.6rem}.ms-card-swatches .swatch{--swatch--size: var(--card-swatch-size, 2.4rem);cursor:pointer;transition:box-shadow .15s ease}.ms-card-swatches__item{position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;line-height:0;text-decoration:none;border-radius:inherit;padding:0;min-width:0;min-height:0}.ms-card-swatches__item:hover .swatch,.ms-card-swatches__item:focus-visible .swatch{box-shadow:0 0 0 .2rem rgba(var(--color-foreground),.3)}.ms-card-swatches__item:focus-visible{outline:.2rem solid rgba(var(--color-foreground),.5);outline-offset:.2rem;border-radius:50%}.ms-swatch-tooltip{position:absolute;bottom:calc(100% + .6rem);left:50%;transform:translate(-50%);padding:.3rem .6rem;font-size:1.1rem;line-height:1.3;white-space:nowrap;color:rgb(var(--color-background));background:rgb(var(--color-foreground));border-radius:.3rem;pointer-events:none;opacity:0;transition:opacity .15s ease;z-index:15}.ms-swatch-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:.4rem solid transparent;border-top-color:rgb(var(--color-foreground))}.ms-swatch-tooltip.ms-swatch-tooltip--flip{bottom:auto;top:calc(100% + .6rem)}.ms-swatch-tooltip.ms-swatch-tooltip--flip:after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:rgb(var(--color-foreground))}.ms-card-swatches__item:hover .ms-swatch-tooltip,.ms-card-swatches__item:focus-visible .ms-swatch-tooltip,.ms-swatch-tooltip.ms-swatch-tooltip--active{opacity:1}.ms-card-swatches__more{display:flex;align-items:center;font-size:1.2rem;line-height:1;color:rgba(var(--color-foreground),.6);text-decoration:none}.ms-card-swatches__more:hover{color:rgb(var(--color-foreground))}
/*# sourceMappingURL=/cdn/shop/t/4/assets/component-swatch.css.map */