/* ═══════════════════════════════════════════════════
   BONUS — бонус первого пополнения, пресеты, серия
═══════════════════════════════════════════════════ */

/* ── Шторка пополнения ── */
.topup-need-hint {
  text-align: center;
  font-size: 12px; font-weight: 700;
  color: var(--ld-star, #FFC83A);
  margin-bottom: 10px;
}

.topup-bonus-banner {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px;
  margin-bottom: 12px;
  border-radius: 16px;
  border: 1px solid transparent;
  background:
    linear-gradient(150deg, #1a1633, #12101c) padding-box,
    var(--ld-holo) border-box;
  box-shadow: var(--ld-glow-violet);
}
.topup-bonus-img { width: 46px; height: 46px; flex-shrink: 0; }
.topup-bonus-banner > div { min-width: 0; }
.topup-bonus-title {
  font-family: var(--ld-font-display);
  font-size: 13px; font-weight: 800; font-style: italic;
  background: var(--ld-holo);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  margin-bottom: 3px;
}
.topup-bonus-terms {
  font-size: 11px; line-height: 1.35;
  color: var(--ld-text-2);
}

.topup-presets {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}
.topup-preset {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  min-height: 52px;
  padding: 8px 4px;
  background: var(--ld-panel);
  border: 1px solid var(--ld-panel-border);
  border-radius: 14px;
  color: #fff;
  font-family: var(--ld-font-ui);
  cursor: pointer;
  transition: transform .1s, border-color .15s;
  -webkit-tap-highlight-color: transparent;
}
.topup-preset:active { transform: scale(.96); }
.topup-preset.need { border-color: var(--ld-star, #FFC83A); }
/* «Не хватает N» добавляется седьмым чипом — отдаём ему всю строку, чтобы
   шесть обычных пресетов остались ровной сеткой 3×2. */
.topup-preset.need:first-child:nth-last-child(7) { grid-column: 1 / -1; }
.topup-preset { min-width: 0; }
.topup-preset-amt   { font-size: 14px; font-weight: 800; white-space: nowrap; }
.topup-preset-bonus { font-size: 10px; font-weight: 700; color: var(--ld-cyan); white-space: nowrap; }

.topup-bonus-preview {
  min-height: 16px;
  margin-top: 8px;
  text-align: center;
  font-size: 12px; font-weight: 700;
  color: var(--ld-cyan);
}

.pw-wager-hint { margin-top: 4px; }

/* ── Ежедневная серия ── */
.task-item[data-cat="streak"] {
  background: linear-gradient(150deg, rgba(169,139,255,.09) 0%, rgba(12,12,20,.95) 100%);
  border-color: rgba(169,139,255,.28);
}
.task-item[data-cat="streak"]::before { background: linear-gradient(90deg, #A98BFF, #F58BF0); }
.task-item[data-cat="streak"] .task-icon { color: #A98BFF; }
.task-item[data-cat="streak"] .task-icon svg { filter: drop-shadow(0 0 6px rgba(169,139,255,.55)); }

.streak-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
  margin-bottom: 10px;
}
.streak-day {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 7px 0;
  border-radius: 10px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
}
.streak-day-n { font-size: 8px; font-weight: 700; color: var(--ld-faint); white-space: nowrap; }
.streak-day-r { font-size: 12px; font-weight: 800; color: var(--ld-star, #FFC83A); }
.streak-day.done {
  background: rgba(0,229,160,.10);
  border-color: rgba(0,229,160,.30);
}
.streak-day.done .streak-day-n { color: #00E5A0; font-size: 10px; }
.streak-day.done .streak-day-r { color: rgba(255,255,255,.45); }
.streak-day.today {
  border-color: var(--ld-violet);
  box-shadow: 0 0 12px rgba(169,139,255,.35);
}
.streak-day.today .streak-day-n { color: #fff; }

/* ── Точка-напоминание на вкладке «Задания» ── */
.nav-dot {
  display: none;
  position: absolute;
  top: 6px; left: calc(50% + 8px);
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--ld-magenta);
  box-shadow: 0 0 8px rgba(245,139,240,.8);
}
.nav-dot.show { display: block; }
