/* Ergänzungen zu /site.css für das Car Voting */

.stat-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.stat { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; }
.stat-label { font-size: 0.78rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.08em; }
.stat-value { font-size: 1.15rem; font-weight: 700; font-variant-numeric: tabular-nums; }
#voteStatus[data-state="open"] { color: var(--ok); }
#voteStatus[data-state="used"] { color: var(--warn); }

.notice { border-color: rgba(245, 185, 66, 0.4); background: rgba(245, 185, 66, 0.07); }
.notice p { margin: 6px 0 0; color: var(--muted); }
.notice strong { color: var(--text); }

.vote-top { margin: 0; }

.pick-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 4px; }
.pick-head .section-title { margin: 0; }
.search { max-width: 320px; }

/* Autokarten sind Buttons – Button-Defaults zurücksetzen */
.vote-grid { margin-top: 14px; }
.car-card {
    position: relative; display: block; width: 100%; padding: 0;
    font: inherit; color: inherit; text-align: left; cursor: pointer;
    transition: border-color 0.15s, transform 0.15s;
}
.car-card:hover { border-color: #3a4254; transform: translateY(-2px); }
.car-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.car-card .car-img, .car-card .car-name { display: block; }
.car-card.voted { border-color: var(--accent); }
.car-voted-badge {
    position: absolute; top: 8px; left: 8px; z-index: 1;
    background: var(--accent); color: var(--accent-ink);
    font-size: 0.75rem; font-weight: 700; padding: 3px 8px; border-radius: 999px;
}

.grid-full { grid-column: 1 / -1; }
.error-box { padding: 28px; text-align: center; }
.error-box p { color: #ff7a66; margin: 0 0 14px; }

.rules { margin: 0; padding-left: 1.2em; color: var(--muted); }
.rules li + li { margin-top: 6px; }

.confirm-name { margin: 0; font-size: 1.2rem; font-weight: 700; }
.vote-warning { margin: 16px 0 0; font-size: 0.9rem; color: var(--warn); }

@media (max-width: 640px) {
    .stat-row { grid-template-columns: 1fr; gap: 10px; }
    .pick-head { flex-direction: column; align-items: stretch; }
    .search { max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
    .car-card { transition: none; }
    .car-card:hover { transform: none; }
}
