.product-swatch-block{margin-bottom:2.4rem}.product-swatch-block__title{margin:0 0 1.2rem;font-size:1.6rem;font-weight:600;line-height:1.2;letter-spacing:.04rem}.product-swatch-block__list{display:flex;flex-wrap:wrap;align-items:flex-start;gap:1.6rem 2rem}.product-swatch-block__item{display:flex;flex-direction:column;align-items:center;gap:.8rem;max-width:9rem;text-align:center}.product-swatch-block__item--link{text-decoration:none;color:inherit;cursor:pointer}.product-swatch-block__swatch{display:block;width:4rem;max-width:100%;aspect-ratio:1 / 1;background:var(--swatch--background);background-position:var(--swatch-focal-point, center);background-size:cover;background-origin:border-box;border:.1rem solid rgba(var(--color-foreground),.15);border-radius:50%;outline:.1rem solid transparent;outline-offset:.2rem;transition:outline-color var(--duration-short, .1s) ease,opacity var(--duration-short, .1s) ease}.product-swatch-block__swatch--empty{position:relative;overflow:hidden;background:rgba(var(--color-foreground),.04);border-style:dashed;border-color:rgba(var(--color-foreground),.4)}.product-swatch-block__placeholder{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;fill:rgba(var(--color-foreground),.3)}.product-swatch-block__label{font-size:1.2rem;line-height:1.3;letter-spacing:.02rem;color:rgba(var(--color-foreground),.7)}.product-swatch-block__item--link:hover .product-swatch-block__swatch{outline-color:rgba(var(--color-foreground),.4)}.product-swatch-block__item--link:hover .product-swatch-block__label{color:rgb(var(--color-foreground))}.product-swatch-block__item--link:focus-visible{outline:none}.product-swatch-block__item--link:focus-visible .product-swatch-block__swatch{outline-color:rgb(var(--color-foreground))}.product-swatch-block__item--link.product-swatch-block__item--active .product-swatch-block__swatch{outline-color:rgb(var(--color-foreground));border-color:rgba(var(--color-foreground),.35)}.product-swatch-block__item--link.product-swatch-block__item--active .product-swatch-block__label{font-weight:500;color:rgb(var(--color-foreground))}.product-swatch-block__item--active{cursor:default}@media screen and (min-width:750px){.product-swatch-block__swatch{width:4.4rem}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/product-swatch-block.css.map */