/* Product art swap. Scope styling to this component so it can join an existing store. */
.dm-product-visual{position:relative;display:block;width:100%;aspect-ratio:1;background:#f5f8f9;overflow:hidden;border:0;padding:0;color:#101423;isolation:isolate}
.dm-product-visual .dm-art{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;transition:opacity 220ms ease;pointer-events:none}
.dm-product-visual .dm-art-hover{opacity:0}
.dm-product-visual[data-logo-preview="true"] .dm-art-primary{opacity:0}
.dm-product-visual[data-logo-preview="true"] .dm-art-hover{opacity:1}
@media(hover:hover) and (pointer:fine){.dm-product-visual[data-hover-ready="true"]:not([data-hover-suppressed="true"]):hover .dm-art-primary{opacity:0}.dm-product-visual[data-hover-ready="true"]:not([data-hover-suppressed="true"]):hover .dm-art-hover{opacity:1}}
.dm-logo-toggle{position:absolute;right:12px;bottom:12px;z-index:2;min-height:44px;padding:9px 14px;border:1px solid #b9c7cd;border-radius:999px;background:#ffffffed;color:#101423;font:600 12px/1.2 system-ui;cursor:pointer;box-shadow:0 2px 8px #1014230a}
.dm-logo-toggle[aria-pressed="true"]{background:#101423;color:white;border-color:#101423}
.dm-logo-toggle:focus-visible{outline:3px solid #007486;outline-offset:3px}
.dm-logo-toggle:disabled{opacity:.6;cursor:wait}
@media(prefers-reduced-motion:reduce){.dm-product-visual .dm-art{transition:none}}
/* keyboard: focusing anything in a product card (or the dialog art's toggle) shows the YOUR LOGO HERE version, unless the toggle just turned it off */
.pcard:has(:focus-visible) .dm-product-visual[data-hover-ready="true"]:not([data-hover-suppressed="true"]) .dm-art-primary,
.dm-product-visual[data-hover-ready="true"]:not([data-hover-suppressed="true"]):has(:focus-visible) .dm-art-primary{opacity:0}
.pcard:has(:focus-visible) .dm-product-visual[data-hover-ready="true"]:not([data-hover-suppressed="true"]) .dm-art-hover,
.dm-product-visual[data-hover-ready="true"]:not([data-hover-suppressed="true"]):has(:focus-visible) .dm-art-hover{opacity:1}
