.cosmetic-variant-picker__fieldset{border:0;margin:0 0 1.2rem;padding:0}.cosmetic-variant-picker__legend{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .8rem;margin-bottom:1.2rem}.cosmetic-variant-picker__new-badge{display:inline-block;padding:.2rem .8rem;border-radius:2rem;background-color:rgb(var(--color-button));color:rgb(var(--color-button-text));font-size:1.1rem;letter-spacing:.05rem;line-height:1.6;text-transform:uppercase}.cosmetic-variant-picker__swatches{display:flex;flex-wrap:wrap;gap:.8rem}.cosmetic-variant-picker__input{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.cosmetic-swatch{position:relative;display:block;width:4.4rem;height:4.4rem;border-radius:50%;background-color:var(--swatch-native, rgba(var(--color-foreground), .08));background-position:50%;background-repeat:no-repeat;background-size:cover;box-shadow:0 0 0 .1rem rgba(var(--color-foreground),.15);cursor:pointer;transition:box-shadow var(--duration-short, .1s) ease}.cosmetic-swatch:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:.3rem solid rgb(var(--color-background));border-radius:inherit;opacity:0;transition:opacity var(--duration-short, .1s) ease}.cosmetic-swatch:hover{box-shadow:0 0 0 .1rem rgba(var(--color-foreground),.6)}.cosmetic-variant-picker__input:checked+.cosmetic-swatch{box-shadow:0 0 0 .2rem rgb(var(--color-foreground))}.cosmetic-variant-picker__input:checked+.cosmetic-swatch:before{opacity:1}.cosmetic-variant-picker__input:focus-visible+.cosmetic-swatch{outline:var(--focused-base-outline);outline-offset:.3rem}.cosmetic-variant-picker__input.disabled+.cosmetic-swatch{opacity:.45}.cosmetic-variant-picker__input.disabled+.cosmetic-swatch:after{content:"";position:absolute;top:50%;left:50%;width:.1rem;height:130%;background-color:rgb(var(--color-foreground));transform:translate(-50%,-50%) rotate(45deg)}.cosmetic-swatch--new:after{content:"";position:absolute;top:-.2rem;right:-.2rem;width:1rem;height:1rem;border:.2rem solid rgb(var(--color-background));border-radius:50%;background-color:rgb(var(--color-button))}.cosmetic-variant-picker__input.disabled+.cosmetic-swatch--new:after{top:50%;right:auto;width:.1rem;height:130%;border:0;border-radius:0;background-color:rgb(var(--color-foreground))}@media screen and (min-width:990px){.cosmetic-swatch{width:4rem;height:4rem}}@media(prefers-reduced-motion:reduce){.cosmetic-swatch,.cosmetic-swatch:before{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/54/assets/component-cosmetic-variant-picker.css.map */