/* Small, accessible vote counters on in-development product images. */
.product.dev-model[data-vote-id] .product-image,
.stroller-item[data-vote-id] .product-image{position:relative}
.vote-chip{
 position:absolute;top:11px;right:11px;z-index:12;
 display:inline-flex;align-items:center;justify-content:center;gap:5px;
 min-width:61px;min-height:34px;padding:7px 10px;
 border:1px solid rgba(255,255,255,.90);border-radius:999px;
 background:rgba(255,253,250,.97);color:#ab4f1f;
 font:inherit;font-size:12px;font-weight:850;line-height:1;
 box-shadow:0 4px 15px rgba(28,24,19,.18);
 -webkit-tap-highlight-color:transparent;cursor:pointer;
 transition:background .17s,color .17s,transform .17s,box-shadow .17s;
}
.vote-chip svg{width:17px;height:17px;display:block;flex:0 0 17px}
.vote-chip:hover:not(:disabled){background:#fff3e8;transform:translateY(-1px);
 box-shadow:0 5px 17px rgba(28,24,19,.25)}
.vote-chip:focus-visible{outline:3px solid #f27622;outline-offset:3px}
.vote-chip[data-voted="true"]{background:#e96f28;color:#fff;
 border-color:#e96f28;cursor:default}
.vote-chip:disabled:not([data-voted="true"]){opacity:.81;cursor:default}
.vote-chip[data-pending="true"]{cursor:progress;opacity:.7}
.vote-chip .vote-chip-count{position:static;left:auto;top:auto;font-size:12px;font-weight:850;color:inherit;font-variant-numeric:tabular-nums;letter-spacing:0}
@media (max-width:680px){
 .vote-chip{top:10px;right:10px;min-height:38px;min-width:65px;padding:9px 11px}
}
/* Votes are layered above the catalog's hover overlay and development badge. */
.product.dev-model[data-vote-id] .vote-chip,.stroller-item[data-vote-id] .vote-chip{pointer-events:auto}

/* Purpose of the heart: tooltip on hover and keyboard focus. */
.vote-chip .vote-tooltip{
 position:absolute;left:auto;right:0;top:calc(100% + 10px);
 width:248px;max-width:calc(100vw - 82px);box-sizing:border-box;
 padding:13px 14px 14px;border:1px solid rgba(255,255,255,.13);
 border-radius:14px;background:rgba(35,34,34,.98);
 box-shadow:0 11px 30px rgba(15,14,12,.26);
 color:#f9f7f4;text-align:left;line-height:1.4;white-space:normal;
 cursor:default;pointer-events:none;
 opacity:0;visibility:hidden;transform:translateY(-4px);
 transition:opacity .16s ease,transform .16s ease,visibility .16s;
 z-index:20;
}
.vote-chip .vote-tooltip::before{
 content:"";position:absolute;top:-5px;right:19px;width:10px;height:10px;
 transform:rotate(45deg);background:rgba(35,34,34,.98);
 border-top:1px solid rgba(255,255,255,.13);
 border-left:1px solid rgba(255,255,255,.13);
}
.vote-chip .vote-tooltip-title{
 display:block;color:#ffa969;font-size:13px;font-weight:830;
 line-height:1.33;margin-bottom:5px;letter-spacing:0;text-transform:none;
}
.vote-chip .vote-tooltip-description{
 display:block;position:static;left:auto;top:auto;color:#f2ebe5;font-size:12px;font-weight:450;
 line-height:1.52;letter-spacing:0;text-transform:none;
}
@media (hover:hover) and (pointer:fine){
 .vote-chip:hover .vote-tooltip{visibility:visible;opacity:1;transform:translateY(0)}
}
.vote-chip:focus-visible .vote-tooltip{
 visibility:visible;opacity:1;transform:translateY(0)
}
/* Keep product imagery visible when the vote tooltip is hovered or focused. */
.product.dev-model[data-vote-id]:has(.vote-chip:hover) .dev-overlay,
.stroller-item[data-vote-id]:has(.vote-chip:hover) .dev-overlay,
.product.dev-model[data-vote-id]:has(.vote-chip:focus-visible) .dev-overlay,
.stroller-item[data-vote-id]:has(.vote-chip:focus-visible) .dev-overlay{opacity:0!important}

@media (prefers-reduced-motion:reduce){
 .vote-chip .vote-tooltip{transition:none}
}