.variant-buttons-wrapper{display:flex;flex-wrap:wrap;gap:.5rem;flex-direction:row}.variant-buttons-wrapper .variant-input{position:absolute;opacity:0;width:0;height:0}.variant-buttons-wrapper .variant-label{display:inline-block;cursor:pointer;padding:2px}.variant-buttons-wrapper .variant-swatch{width:25px;height:13px;display:block;transition:all .2s ease}fieldset[data-variants-type=color] .variant-buttons-wrapper input[type=radio]:checked+label>span.variant-swatch,fieldset[data-variants-type=color] .variant-buttons-wrapper input[type=radio]+label:has(.color-name.selected)>span.variant-swatch{width:100%}fieldset[data-variants-type=color] .variant-buttons-wrapper input[type=radio]:checked+label{text-decoration:unset}span.variant-name.color-name{font-size:11px;font-weight:400;padding:3px 0;display:none;text-transform:uppercase}fieldset[data-variants-type=color] .variant-buttons-wrapper input[type=radio]:checked+label>span.variant-name.color-name,span.variant-name.color-name.selected{display:block}.product-form__input--pill .variant-buttons-wrapper input[type=radio].disabled:checked+label{color:unset}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.product-form__input--pill .variant-buttons-wrapper input[type=radio].disabled+label{opacity:.5}.variant-buttons-wrapper .variant-input.disabled+.variant-label:before{content:"";height:1px;width:calc(100% - 1rem);background-color:rgb(var(--color-text));transform:rotate(-45deg);left:5px;top:22px;z-index:1}.variant-buttons-wrapper label.variant-label:has(img){width:10%;min-width:unset}.variant-buttons-wrapper .variant-input:checked+.variant-label img{border-bottom:1px solid rgb(var(--color-text));padding-bottom:4px}.variant-buttons-wrapper label.variant-label span.image-variant-name{font-size:11px}.variant-buttons-wrapper .variant-input.disabled+.variant-label:has(img):before,.color-variant:has(img):before{display:none}@media screen and (max-width: 1024px){.variant-buttons-wrapper label.variant-label:has(img){width:25%}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/component-variant-swatch.css.map */
