.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, center);background-size:cover;background-origin:content-box;background-repeat:no-repeat;border:.1rem solid rgba(var(--color-foreground),.3);border-radius:var(--swatch--border-radius);padding:var(--swatch--padding, 0px)}.swatch--square{--swatch--border-radius: var(--swatch-input--border-radius, .2rem)}.swatch--unavailable{border-style:dashed!important;border-color:rgba(var(--color-foreground),.3);position:relative}.swatch--unavailable:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(var(--color-foreground),.3);-webkit-mask-image:var(--swatch-unavailable-icon);mask-image:var(--swatch-unavailable-icon);-webkit-mask-size:64%;mask-size:64%;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.swatch-input__label{background-color:#fff}.swatch-input__input:active+.swatch-input__label .swatch,.swatch-input__input:checked+.swatch-input__label .swatch{border:.1rem solid rgb(var(--color-foreground))}.swatch-input__input+.swatch-input__label:hover .swatch,.swatch-input__input:hover+.swatch-input__label .swatch{outline:.3rem solid rgba(var(--color-foreground),.2)}.swatch-input__input:focus-visible+.swatch-input__label .swatch{outline:.3rem solid rgba(var(--color-foreground),.2);box-shadow:0 0 0 .2rem rgb(var(--color-background)),0 0 .1rem .5rem rgba(var(--color-foreground),.2)}.swatch-input__input:active:focus-visible+.swatch-input__label .swatch,.swatch-input__input:checked:focus-visible+.swatch-input__label .swatch{outline:.1rem solid rgb(var(--color-foreground));box-shadow:0 0 0 .2rem rgb(var(--color-background)),0 0 .1rem .4rem rgba(var(--color-foreground),.2)}
/*# sourceMappingURL=/cdn/shop/t/5/assets/component-swatch.css.map */