.visual-display,.swatch{--visual-display-size: min(2.4rem, 100%);position:relative;width:var(--visual-display-size);max-width:100%;background-origin:border-box;border:.1rem solid var(--color-foreground);aspect-ratio:1/1}.swatch{--swatch-input--size: var(--visual-display-size);background:var(--swatch--background);background-position:var(--swatch-focal-point, initial);background-size:cover;display:inline-block}.visual-display.empty{border-style:dashed}.swatch--unavailable{border-style:dashed;border-color:rgba(var(--color-foreground),.5)}.visual-display--presentation-swatch,.swatch{--visual-display-size: min(2.4rem, 100%);border-radius:var(--swatch-border-radius);overflow:hidden}.visual-display-parent .visual-display--presentation-swatch,.swatch{outline-offset:.2rem}:is(.visual-display-parent:hover .visual-display--presentation-swatch,.visual-display-parent.active .visual-display--presentation-swatch,.visual-display-parent:has(:focus-visible) .visual-display--presentation-swatch,.swatch-input__label:hover .swatch,input:checked+.swatch-input__label>.swatch,.swatch-input__label:has(:focus-visible) .swatch){outline-style:solid}.visual-display-parent.active .visual-display--presentation-swatch,input:checked+.swatch-input__label>.swatch{outline-width:.1rem;outline-color:var(--color-foreground)}.visual-display-parent:hover .visual-display--presentation-swatch,.swatch-input__label:hover>.swatch{outline-width:.2rem;outline-color:var(--color-foreground)}.visual-display-parent:has(:focus-visible) .visual-display--presentation-swatch,.swatch-input__label:has(:focus-visible) .swatch{outline-width:.2rem;outline-color:var(--color-foreground);box-shadow:0 0 0 .6rem var(--color-background),0 0 0 .8rem var(--color-foreground),0 0 1.2rem .4rem var(--color-foreground)}@supports not selector(:has(a,b)){.visual-display-parent:focus-within .visual-display--presentation-swatch,.swatch-input__label:focus-within .swatch{outline-offset:.2rem;outline:.2rem solid var(--color-foreground);box-shadow:0 0 0 .6rem var(--color-background),0 0 0 .8rem var(--color-foreground),0 0 1.2rem .4rem var(--color-foreground)}}.visual-display-parent.disabled{opacity:.5;cursor:not-allowed}.visual-display-parent.disabled .visual-display:after{display:block;content:"";width:calc(var(--visual-display-size) * 1.414);transform:rotate(-45deg);transform-origin:left}.visual-display .visual-display__child{display:block;height:100%;width:100%}.visual-display--presentation-swatch .visual-display__image{object-fit:cover}.swatch-input__input:disabled+.swatch-input__label>.swatch:before,.swatch-input__input.disabled+.swatch-input__label>.swatch:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#fafafa80}.swatch-input__input:disabled+.swatch-input__label>.swatch:after,.swatch-input__input.disabled+.swatch-input__label>.swatch:after{--diagonal--size: calc(var(--swatch-input--size) * 1.414);--crossed-line--size: .1rem;--crossed-line--color: rgb(0, 0, 0);content:"";position:absolute;bottom:calc(var(--crossed-line--size) * -.5);inset-inline-start:0;width:var(--diagonal--size);height:var(--crossed-line--size);background-color:var(--crossed-line--color);transform:rotate(-45deg);transform-origin:left}
/*# sourceMappingURL=/cdn/shop/t/23/assets/component-visual-display.css.map */