.swatch{--swatch--size: var(--swatch-input--size, 4.4rem);--swatch--border-radius: var(--swatch-input--border-radius, 50%);display:block;width:var(--swatch--size);max-width:100%;aspect-ratio:1 / 1;background:var(--swatch--background);background-position:var(--swatch-focal-point, initial);background-size:cover;background-origin:border-box;border-width:.1rem;border-style:solid;border-color:color-mix(in srgb,black 20%,var(--swatch--background));border-radius:var(--swatch--border-radius)}.swatch--square{--swatch--border-radius: 0}.swatch--unavailable{border-style:dashed;border-color:rgba(var(--color-foreground),.5)}swatch-group{display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-x-small);margin-block-start:var(--spacing-xx-small)}swatch-group .active{outline:1px solid var(--bg-color-black);outline-offset:1px}swatch-group .button.link.swatch-button,swatch-group .button.link.swatch-link{overflow:hidden;position:relative;z-index:1;outline-offset:0;height:-moz-fit-content;height:fit-content}swatch-group .button.link.swatch-button img,swatch-group .button.link.swatch-link img{mix-blend-mode:multiply}swatch-group .button.link .swatch-placeholder svg{width:100%;height:100%}swatch-group .button.link.swatch-button--unavailable,swatch-group .button.link.swatch-link--unavailable{outline:1px solid var(--body-text-color);opacity:.6}swatch-group .button.link.swatch-button--unavailable:before,swatch-group .button.link.swatch-link--unavailable:before{content:"";position:absolute;top:0%;left:-50%;border-top:1px solid var(--body-text-color);width:150%;transform:rotate(315deg);transform-origin:top right}swatch-group .button.link.swatch-button--unavailable img,swatch-group .button.link.swatch-link--unavailable img{position:relative;z-index:-1}swatch-group .button.link.swatch-button:not(:focus-visible):not(.swatch-button--unavailable),swatch-group .button.link.swatch-button:not(:focus):not(.swatch-button--unavailable),swatch-group .button.link.swatch-link:not(:focus-visible):not(.swatch-link--unavailable),swatch-group .button.link.swatch-link:not(:focus):not(.swatch-link--unavailable){outline:var(--inputs-border-width) solid var(--border-color)}swatch-group .button.link.swatch-button.active:not(:focus-visible),swatch-group .button.link.swatch-button.active:not(:focus),swatch-group .button.link.swatch-link.active:not(:focus-visible),swatch-group .button.link.swatch-link.active:not(:focus){outline-color:var(--focus-color);outline-offset:0}swatch-group .button.link.swatch-button--more,swatch-group .button.link.swatch-link--more{align-items:center;display:flex;justify-content:center;height:1.5rem;width:1.5rem}swatch-group .button.link.swatch-button--more quick-add-modal,swatch-group .button.link.swatch-link--more quick-add-modal{height:1.5rem;width:1.5rem}swatch-group .swatch-link.sold-out{position:relative;cursor:not-allowed}swatch-group .swatch-link.sold-out:after{content:"";position:absolute;width:1px;height:40px;background-color:var(--bg-color-white);transform:translate(-50%,-50%) rotate(45deg);top:50%;left:50%;z-index:1}swatch-group .swatch-link.swatch-link--circle{border-radius:50%}swatch-group .swatch-link.swatch-link--circle img,swatch-group .swatch-link.swatch-link--circle .swatch-link__solid-bg{border-radius:50%;border:var(--inputs-border-width) solid rgba(0,0,0,.2)}swatch-group .swatch-link.swatch-link--circle.active img{border-color:transparent}swatch-group .swatch-link.swatch-link--circle.active .swatch-link__solid-bg{border-color:var(--bg-color-white)}swatch-group .swatch-button.swatch-button--circle{border-radius:50%}swatch-group .swatch-button.swatch-button--circle img,swatch-group .swatch-button.swatch-button--circle .swatch-button__solid-bg{border-radius:50%;border:var(--inputs-border-width) solid rgba(0,0,0,.2)}swatch-group .swatch-button.swatch-button--circle.active img{border-color:transparent}swatch-group .swatch-button.swatch-button--circle.active .swatch-button__solid-bg{border-color:var(--bg-color-white)}swatch-group .swatch-button .swatch-button__solid-bg{display:flex}swatch-group .swatch-link__solid-bg,swatch-group .swatch-button__solid-bg{width:var(--size);height:auto;aspect-ratio:1}@media (max-width: 768px){swatch-group.swatch-group--mobile-limit>.button.link.swatch-button--more-desktop{display:none}}@media (min-width: 769px){swatch-group.swatch-group--mobile-limit>.button.link[class*=swatch-button--more-mobile]{display:none}}@media (min-width: 389px) and (max-width: 768px){swatch-group.swatch-group--mobile-limit:has(.swatch-button--more-mobile-wide) .button.link.swatch-button--more-mobile-narrow{display:none}swatch-group.swatch-group--mobile-limit:has(.swatch-button--more-mobile-wide)>.button.link:nth-child(n+4):not(.swatch-button--more){display:none}}@media (max-width: 388px){swatch-group.swatch-group--mobile-limit:has(.swatch-button--more-mobile-narrow) .button.link.swatch-button--more-mobile-wide{display:none}swatch-group.swatch-group--mobile-limit:has(.swatch-button--more-mobile-narrow)>.button.link:nth-child(n+3):not(.swatch-button--more){display:none}}@media (min-width: 1024px) and (max-width: 1038px){.facets-vertical swatch-group>.button.link:nth-child(n+6):not(.swatch-button--more){display:none}}@media (min-width: 1201px) and (max-width: 1226px){.facets-vertical swatch-group>.button.link:nth-child(n+5):not(.swatch-button--more){display:none}}@media (min-width: 1227px) and (max-width: 1370px){.facets-vertical swatch-group>.button.link:nth-child(n+6):not(.swatch-button--more){display:none}}