/* assets/hirfeed-poll.css — önálló szavazás-modul (2026-08-08).
   A doboz-stílus szándékosan ugyanaz, mint a .hf-article-credits/.hf-article-audio-é
   (l. hirfeed.css) — vizuálisan egy családba tartozzon a cikk többi „kiemelt" blokkjával.
   A színeket a .hf-hir wrapper --hf-* változóiból veszi (nincs saját szín-definíció). */

.hf-poll {
  margin: 20px 0;
  padding: 16px 18px;
  background: #faf8f4;
  border: 1px solid var(--hf-rule);
  border-left: 3px solid var(--hf-accent);
  border-radius: 4px;
}

.hf-poll-loading {
  font-family: var(--hf-font-ui);
  font-size: 13px;
  color: var(--hf-muted);
  margin: 0;
}

.hf-poll-question {
  font-family: var(--hf-font-head);
  font-weight: 700;
  font-size: 16px;
  color: var(--hf-text);
  margin: 0 0 12px;
}

/* ── Szavazó-űrlap ────────────────────────────────────────────────────────── */
.hf-poll-form { display: flex; flex-direction: column; gap: 8px; }
.hf-poll-opt {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--hf-font-body); font-size: 14.5px; color: var(--hf-text);
  cursor: pointer; padding: 4px 2px;
}
.hf-poll-opt input { flex: 0 0 auto; accent-color: var(--hf-accent); width: 16px; height: 16px; cursor: pointer; }
.hf-poll-submit {
  align-self: flex-start; margin-top: 6px;
  background: var(--hf-accent); color: #fff; border: 0; border-radius: 4px;
  font-family: var(--hf-font-ui); font-weight: 700; font-size: 13px;
  padding: 9px 20px; cursor: pointer;
}
.hf-poll-submit:hover { opacity: .9; }
.hf-poll-submit:disabled { opacity: .5; cursor: default; }
.hf-poll-err {
  font-family: var(--hf-font-ui); font-size: 12px; color: var(--hf-accent);
  margin: 2px 0 0;
}

/* ── Eredmény: vízszintes oszlopdiagram ──────────────────────────────────── */
.hf-poll-results { display: flex; flex-direction: column; gap: 10px; }
.hf-poll-row { display: grid; grid-template-columns: minmax(90px, 1fr) 2fr auto; align-items: center; gap: 10px; }
.hf-poll-row-label {
  font-family: var(--hf-font-body); font-size: 13.5px; color: var(--hf-text);
  overflow-wrap: anywhere;
}
.hf-poll-row--mine .hf-poll-row-label { font-weight: 700; }
.hf-poll-your { color: var(--hf-accent); font-weight: 700; }
.hf-poll-track {
  height: 14px; background: #fff; border: 1px solid var(--hf-rule); border-radius: 3px;
  overflow: hidden;
}
.hf-poll-bar {
  height: 100%; background: var(--hf-accent); border-radius: 2px 0 0 2px;
  transition: width .5s ease-out;
}
.hf-poll-stats {
  font-family: var(--hf-font-ui); font-size: 12px; color: var(--hf-muted);
  white-space: nowrap; text-align: right; min-width: 64px;
}
.hf-poll-total {
  font-family: var(--hf-font-ui); font-size: 11px; color: var(--hf-muted);
  margin: 12px 0 0; text-align: right;
}

/* Kis képernyőn a sor 2 sorba törik (címke fent, sáv+szám alatt) — a 90px-es label
   túl szűk lenne mobilon a hosszabb válaszokhoz. */
@media (max-width: 480px) {
  .hf-poll-row { grid-template-columns: 1fr; gap: 4px; }
  .hf-poll-stats { text-align: left; min-width: 0; }
}