/* === FAKE POLL (ankieta) – kompakt + mobile 2 kolumny
   FIXES: brak overflow, minmax kolumn, czytelność po głosie, złoty lider === */

.fake-vote{
  margin: 18px auto 8px;
  padding: 14px;
  border-radius: 12px;

  /* identyczne jak panel czatu (#ogchat .chat) */
  background-color: rgba(255, 182, 193, 0.08);
  border: 1px solid rgba(255, 182, 193, 0.15);
  box-shadow: 0 8px 24px rgba(255, 182, 193, 0.08);

  max-width: 900px;
  overflow: hidden;
  box-sizing: border-box;
}
.fake-vote * { box-sizing: border-box; }

.fake-vote .vote-title{
  font-size: 20px;
  font-weight: 800;
  margin-bottom: 12px;
  text-align: center;
  background: linear-gradient(90deg, #ff9ad5, #c7a6ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* GRID: desktop – 1 kolumna; mobile – 2 kolumny (minmax(0,1fr) usuwa overflow) */
.vote-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  width: 100%;
}
@media (max-width: 768px){
  .vote-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
}

/* Karta opcji (klikana) */
.vote-card{
  appearance: none;
  width: 100%;
  border: 0;
  text-align: left;
  cursor: pointer;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  transition: transform .12s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
  min-height: 88px; /* po głosie napisy nie „uciekają” */
  color: #fff;
}
.vote-card:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(255, 121, 198, 0.18);
  border-color: rgba(255, 121, 198, 0.35);
  background: rgba(255,255,255,0.08);
}
.vote-card:focus-visible{
  outline: none;
  box-shadow: 0 0 0 2px rgba(255,121,198,.55), 0 10px 22px rgba(255,121,198,.2);
}
.fake-vote.is-voted .vote-card{ cursor: default; }
.fake-vote.is-voted .vote-card:hover{ transform:none; box-shadow:none; }

/* Label + pasek + meta */
.vote-label{
  display:block;
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: #fff;
}

.vote-bar{
  height: 10px;
  background: rgba(255,255,255,0.10);
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  margin-bottom: 6px;
}
.vote-bar .fill{
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #ff79c6 0%, #ff4fa3 60%, #ff2e93 100%); /* domyślnie róż */
  box-shadow: inset 0 6px 16px rgba(255, 79, 163, 0.25);
  transition: width .9s cubic-bezier(.2,.8,.2,1);
}

.vote-meta{
  display:flex; align-items:center; justify-content:space-between;
  font-size: 13px;
  color: #e9e9f1;
}
.vote-percent{ font-weight: 800; color:#fff; }
.vote-count{ opacity:.85; }

/* Notka statusu */
.vote-note{
  margin-top: 10px;
  font-size: 13px;
  text-align: center;
  color: #ffdff0;
}

/* Wersja „mocniej zwarta” na bardzo wąskich ekranach */
.fake-vote--mobile-fit .vote-card{ padding: 10px; }
.fake-vote--mobile-fit .vote-label{ font-size: 14px; margin-bottom: 6px; }
.fake-vote--mobile-fit .vote-bar{ height: 8px; margin-bottom: 6px; }
.fake-vote--mobile-fit .vote-meta{ font-size: 12px; }
.fake-vote--mobile-fit{ padding: 12px; }

@media (max-width: 380px){
  .fake-vote--mobile-fit .vote-label{ font-size: 13px; }
  .fake-vote--mobile-fit .vote-meta{ font-size: 11.5px; }
}

/* === ZŁOTY LIDER – delikatne wyróżnienie zwycięskiej opcji === */
.vote-card.is-leading{
  border-color: rgba(247, 208, 138, .55) !important;
  box-shadow: 0 8px 24px rgba(247, 208, 138, .12);
}
.vote-card.is-leading .vote-bar .fill{
  background: linear-gradient(90deg, #f7d08a 0%, #f1c35e 50%, #e4ad45 100%);
}
.vote-card.is-leading .vote-label{
  background: linear-gradient(90deg, #f7d08a, #e4ad45);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}