.e8-color-dot{display:inline-block;width:1.4rem;height:1.4rem;border-radius:50%;border:1px solid rgba(0,0,0,.22);flex-shrink:0;box-shadow:0 0 0 1px rgba(255,255,255,.75)}
.e8-color-dot--black{background:#191919}
.e8-color-dot--burgundy{background:#642c38}
.e8-card-colors{display:flex;flex-wrap:wrap;gap:.3rem .8rem;margin:0 0 .9rem;position:relative;z-index:2}
.e8-card-color{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-width:4.4rem;min-height:4.4rem;padding:.35rem .65rem;color:rgb(var(--color-foreground));text-decoration:none;font-size:1.2rem;line-height:1.2;border:1px solid transparent;border-radius:3px;background:rgb(var(--color-background))}
.e8-card-color[aria-current=true]{border-color:currentColor}
.e8-card-color:hover{border-color:rgba(var(--color-foreground),.5)}
.e8-card-color:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.e8-color-selected .card__media .media--hover-effect>img:first-child{opacity:1!important;transform:none!important}
.e8-color-selected .card__media .media--hover-effect>img+img{opacity:0!important}
.product-form__input--pill input[type=radio]+label .e8-color-dot{vertical-align:middle;margin-right:.7rem}

.e8-color-dot--image{width:3.6rem;height:3.6rem;overflow:hidden;border:1px solid rgba(0,0,0,.35);box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.e8-color-dot--image img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.e8-card-color .e8-color-dot--image{width:2.8rem;height:2.8rem}
.product-form__input--pill input[type=radio]+label:has(.e8-color-dot--image){display:inline-flex;align-items:center;gap:.8rem;min-height:5.2rem;padding:.55rem 1.2rem;vertical-align:middle}
.product-form__input--pill input[type=radio]+label .e8-color-dot--image{margin-right:0}
.product-form__input--pill input[type=radio]:checked+label .e8-color-dot--image{box-shadow:0 0 0 2px rgb(var(--color-background))}