/* Shared canvas cards: artwork, title, starting price, real part choices. */
.vh-canvas-card{min-width:0;display:flex;flex-direction:column;color:#1a1715}
.vh-canvas-card .cp-card__media{display:block;position:relative;aspect-ratio:1;overflow:hidden;border-radius:10px;background:#faf8f5}
.vh-canvas-card .cp-card__img-real{display:block;width:100%;height:100%;object-fit:contain;transform:none!important}
.vh-canvas-card .cp-card__info{padding:12px 0 0}
.vh-canvas-card .cp-card__name{font-family:Geologica,Onest,system-ui,sans-serif;font-size:16px;font-weight:700;line-height:1.4;letter-spacing:-.02em;margin:0 0 8px;min-height:2.8em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.vh-canvas-card .cp-card__name a{color:inherit;text-decoration:none}
.vh-canvas-card .cp-card__price{font:700 22px/1.3 Onest,system-ui,sans-serif;color:#1a1715;font-variant-numeric:tabular-nums}
.vh-canvas-card .cp-card__price-prefix{font-size:14px;font-weight:400;color:#4a4440;margin-right:4px}
.vh-canvas-card .cp-card__price del{font-size:.7em;color:#756e66;font-weight:400}
.vh-canvas-card .cp-card__price ins{background:none;text-decoration:none}
.vh-canvas-card .woocommerce-Price-amount{white-space:nowrap}
/* Keep choices on one row; narrow cards scroll without clipping focus rings. */
.vh-canvas-card .vh-card-shapes{display:flex;flex-wrap:nowrap;gap:4px;max-width:calc(100% + 8px);overflow-x:auto;scrollbar-width:thin;padding:4px;margin:8px -4px -4px}
.vh-canvas-card .vh-card-shapes:empty{display:none}
.vh-canvas-card .vh-card-shapes button{flex-shrink:0;width:42px;min-height:40px;padding:5px;border:1px solid #d4cbc0;border-radius:9px;background:#fff;color:#2c2825;cursor:pointer;display:grid;place-items:center}
/* Center compact choices while keeping both ends reachable when scrolling. */
.vh-canvas-card .vh-card-shapes button:first-child{margin-inline-start:auto}
.vh-canvas-card .vh-card-shapes button:last-child{margin-inline-end:auto}
.vh-canvas-card .vh-card-shapes svg{width:30px;height:24px;fill:currentColor}
.vh-canvas-card .vh-card-shapes button[aria-pressed=true]{border-color:#7c3aed;background:#7c3aed0d;box-shadow:0 0 0 1px #7c3aed}
.vh-canvas-card a:focus-visible,.vh-canvas-card button:focus-visible{outline:2px solid #7c3aed;outline-offset:3px}
.vh-canvas-card .vh-card-next{position:absolute;inset:0;pointer-events:none}
@media(max-width:600px){.vh-canvas-card .cp-card__name{font-size:15px}.vh-canvas-card .cp-card__price{font-size:20px}.vh-canvas-card .vh-card-shapes button{width:38px;min-height:38px}}

/* Visible part counts stay inside the same accessible click target as the icon. */
.vh-design-card .vh-card-shapes button{flex:0 0 48px;width:48px;min-width:48px;height:54px;min-height:54px;padding:6px 3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.vh-design-card .vh-card-shapes svg{width:26px;height:22px;flex:none}
.vh-design-card .vh-card-parts-label{font:500 10px/1.3 Onest,system-ui,sans-serif;color:inherit;white-space:nowrap}
/* A single available part count is not a choice; collapse the entire control row. */
.vh-design-card .vh-card-shapes:not(:has(> button ~ button)){display:none}

/* Reserve five equal slots on small screens, regardless of the option count. */
@media(max-width:991px){
  .vh-design-card .vh-card-shapes{gap:2px;overflow:visible}
  .vh-design-card .vh-card-shapes button{box-sizing:border-box;flex:0 0 calc((100% - 8px)/5);width:calc((100% - 8px)/5);min-width:0;max-width:32px;height:44px;min-height:44px;padding:4px 1px;border-radius:6px;gap:2px}
  .vh-design-card .vh-card-shapes svg{width:20px;max-width:100%;height:18px}
  .vh-design-card .vh-card-parts-label{display:none}
  .vh-design-card .vh-card-shapes button::after{content:attr(data-parts);font:500 10px/1.3 Onest,system-ui,sans-serif}
}

