.color-swatches{margin:1.5rem 0}.color-swatches__heading{display:block;margin-bottom:8px;font-size:1rem}.color-swatches__list{display:flex;flex-wrap:wrap;gap:.75rem;align-items:flex-start}.color-swatch{display:inline-flex;flex-direction:column;align-items:center;gap:.375rem;text-decoration:none;cursor:pointer}.color-swatch__color{position:relative;width:40px;height:40px;display:block;border-radius:50%;background-color:transparent}.color-swatch__color:before{content:"";position:absolute;z-index:0;top:0;left:0;width:100%;height:100%;margin:0;border-radius:50%;background-color:currentColor}.color-swatch__color:after{content:"";position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;border:1px var(--input-border-color) solid;border-radius:50%;box-shadow:inset 0 0 0 2px #fff}@media (hover: hover){.color-swatch:hover .color-swatch__color:after{border:2px var(--input-border-color-hover) solid}}@media (hover: none){.color-swatch:active .color-swatch__color:after{border:2px var(--input-border-color-hover) solid}}.color-swatch--current{cursor:default}.color-swatch--current .color-swatch__color:after{border:2px var(--input-border-color-active) solid;box-shadow:inset 0 0 0 2px #fff,0 0 0 var(--input-active-shadow-width) var(--input-border-color-active)}.color-swatch__name{font-size:.75rem;color:#666;text-align:center;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.color-swatch--current .color-swatch__name{font-weight:600;color:#333}@media (max-width: 768px){.color-swatch__color{width:36px;height:36px}.color-swatches__list{gap:.625rem}}
/*# sourceMappingURL=/cdn/shop/t/185/assets/color-swatches.css.map */
