.visual-display{--visual-display__size: min(2.4rem, 100%);position:relative;width:var(--visual-display__size);max-width:100%;border:.1rem solid rgba(var(--color-foreground),.2);aspect-ratio:1/1}.visual-display.empty{border-style:dashed}.visual-display--presentation-swatch{--visual-display__size: min(2.4rem, 100%);border-radius:100%;overflow:hidden}.visual-display-parent .visual-display--presentation-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){outline-style:solid}.visual-display-parent.active .visual-display--presentation-swatch{outline-width:.1rem;outline-color:rgb(var(--color-foreground),1)}.visual-display-parent:hover .visual-display--presentation-swatch{outline-width:.1rem;outline-color:rgb(var(--color-foreground),.4)}.visual-display-parent:has(:focus-visible) .visual-display--presentation-swatch{outline-width:.2rem;outline-color:rgb(var(--color-foreground),.4);box-shadow:0 0 0 .6rem rgb(var(--color-background)),0 0 0 .8rem rgba(var(--color-foreground),.5),0 0 1.2rem .4rem rgba(var(--color-foreground),.3)}@supports not selector(:has(a,b)){.visual-display-parent:focus-within .visual-display--presentation-swatch{outline-offset:.2rem;outline:.2rem solid rgb(var(--color-foreground),.4);box-shadow:0 0 0 .6rem rgb(var(--color-background)),0 0 0 .8rem rgba(var(--color-foreground),.5),0 0 1.2rem .4rem rgba(var(--color-foreground),.3)}}.visual-display-parent.disabled{opacity:.4;pointer-events:none}.visual-display-parent.disabled .visual-display:after{display:block;content:"";width:calc(var(--visual-display__size) * 1.414);border-bottom:.1rem solid rgba(var(--color-foreground),.5);transform:rotate(-45deg);transform-origin:left}.visual-display .visual-display__child{display:block;height:100%;width:100%;forced-color-adjust:none}.visual-display--presentation-swatch .visual-display__image{object-fit:cover}.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:.1rem solid rgba(var(--color-foreground),.15);border-radius:var(--swatch--border-radius)}.swatch--square{--swatch--border-radius: var(--swatch-input--border-radius, 0)}.swatch--unavailable{border-style:dashed;border-color:rgba(var(--color-foreground),.5)}
/*# sourceMappingURL=/cdn/shop/t/13/assets/component-visual-display.css.map */
