/* assets/styles/polls.css */

/* ===== Виджет опроса ===== */
.poll {
  padding: 0 12px 12px;
  background: #fff;
}

.poll__question {
  font-weight: 700;
  margin-bottom: 10px;
}

.poll__notice,
.poll__hint {
  font-size: 14px;
  color: #556;
  margin-top: 8px;
}

.poll__options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.poll__option-btn {
  appearance: none;
  border: 1px solid #cfd6dd;
  background: #f7fafc;
  padding: 10px 12px;
  text-align: left;
  cursor: pointer;
  transition:
    background 0.2s ease,
    border-color 0.2s ease;
}
.poll__option-btn:hover {
  background: #eef3f8;
  border-color: #b8c4d0;
}
.poll__option-btn:disabled {
  opacity: 0.6;
  cursor: default;
}

.poll__results {
  display: block;
}

.poll__result-row + .poll__result-row {
  margin-top: 10px;
}

.poll__result-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  font-size: 14px;
  margin-bottom: 6px;
}

.poll__result-label {
  color: #223;
  font-weight: 500;
}

.poll__result-percent {
  color: #334;
  font-weight: 700;
}

.poll__bar {
  position: relative;
  height: 10px;
  background: #eef2f6;
  overflow: hidden;
}
.poll__bar-fill {
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #5aa6ff, #2f7dff);
  transition: width 0.7s ease;
}

.poll__total {
  margin-top: 10px;
  font-size: 13px;
  color: #556;
}

.standings-info {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.poll__toast {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid #f2d39b;
  background: #fff8e6;
  color: #5a4700;
  font-size: 14px;
  transition: opacity 0.2s ease;
}
.poll__toast.is-visible {
  opacity: 1;
}

/* ===== Светлая тема опроса в стиле Serie A ===== */
.poll--seriea-light {
  background: radial-gradient(circle at 0% 0%, #ffffff 0%, #f7f3ee 60%);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
  color: #1a2a3a;
  position: relative;
  overflow: hidden;
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    'Inter',
    Roboto,
    'Segoe UI',
    sans-serif;
}

/* Вопрос */
.poll--seriea-light .poll__question {
  font-weight: 700;
  font-size: 13px;
  line-height: 1.3;
  color: #f8f8ed;
  margin-bottom: 14px;
  background-color: #0e1c44;
  padding: 5px 10px;
}

/* Подсказки под формой */
.poll--seriea-light .poll__hint,
.poll--seriea-light .poll__notice,
.poll--seriea-light .poll__total {
  color: rgba(17, 24, 39, 0.6); /* мягкий серо-синий текст */
  font-size: 13px;
}

/* Кнопки вариантов ДО голосования */
.poll--seriea-light .poll__option-btn {
  background: #ffffff;
  color: #1a2a3a;
  border: 1px solid #d5d0c8;
  font-weight: 600;
  line-height: 1.3;
  padding: 12px 14px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.03);
  transition:
    background 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
}
.poll--seriea-light .poll__option-btn:hover {
  background: #f7f3ee;
  border-color: #1135b4;
  box-shadow: 0 4px 10px rgba(17, 53, 180, 0.08);
  color: #1135b4;
}

/* Тост про авторизацию */
.poll--seriea-light .poll__toast {
  background: #fffef3;
  border-color: #e5dc9a;
  color: #4e4600;
  font-size: 13px;
}

/* каждая строка результата — две колонки: команда | бар+% */
.poll--seriea-light .poll__result-row {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 12px;
  row-gap: 6px;
  /* визуальное отделение строк */
  padding: 8px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

/* убираем лишний нижний бордер у последней строки */
.poll--seriea-light .poll__result-row:last-child {
  border-bottom: 0;
}

/* левая колонка: название команды */
.poll--seriea-light .poll__result-left {
  min-width: 90px; /* <-- можешь подправить под свои самые длинные названия */
  font-size: 14px;
  font-weight: 600;
  color: #1a2a3a;
  line-height: 1.3;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

/* правая колонка: полоса + % */
.poll--seriea-light .poll__result-right {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  column-gap: 8px;
}

/* сама полоса */
.poll--seriea-light .poll__bar {
  position: relative;
  height: 10px;
  background: rgba(17, 53, 180, 0.08); /* очень светлый синий фон трека */
  border-radius: 6px;
  overflow: hidden;
}

/* заливка полосы */
.poll--seriea-light .poll__bar-fill {
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #226a9e 0%, #1b7fac 50%, #1135b4 100%);
  border-radius: 6px;
  box-shadow: 0 0 8px rgba(17, 53, 180, 0.4);
  transition: width 0.7s ease;
}

/* процент справа от полосы */
.poll--seriea-light .poll__result-percent {
  font-size: 13px;
  font-weight: 700;
  color: #0e1c44;
  line-height: 1;
}

/* итого голосов внизу */
.poll--seriea-light .poll__total {
  margin-top: 12px;
  text-align: right;
}

/* маленький штрих: мягкий внутренний обвод по краям блока */
.poll--seriea-light {
  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.06),
    0 0 0 1px rgba(0, 0, 0, 0.03) inset;
}