/* ═══════════════════════════════════════════════
   IRONFORM Quiz — Cinematic Theme v2
   Подключается в </head> каждой страницы квиза.
   Переопределяет инлайн-стили через ту же
   специфичность, но более позднюю загрузку.
   ═══════════════════════════════════════════════ */

/* ── Кнопка «Продолжить / Понятно / Получить план» ── */
.cont-btn {
  background:
    linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 45%),
    radial-gradient(ellipse at 50% 25%, #D8FF10 0%, #C8F000 48%, #76A400 100%);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.65),
    inset 0 -2px 0 rgba(0,0,0,.22),
    0 2px 12px rgba(200,240,0,.13),
    0 6px 20px rgba(200,240,0,.06);
  border-radius: 14px;
  letter-spacing: .8px;
}
.cont-btn:disabled {
  background: rgba(200,240,0,.18) !important;
  box-shadow: none !important;
  opacity: 1 !important;
  cursor: default !important;
  border-radius: 14px !important;
}
.cont-btn:not(:disabled):hover {
  filter: brightness(1.07);
  transform: translateY(-2px);
  box-shadow:
    inset 0 1.5px 0 rgba(255,255,255,.65),
    inset 0 -2px 0 rgba(0,0,0,.22),
    0 4px 20px rgba(200,240,0,.55),
    0 8px 32px rgba(200,240,0,.28);
}
.cont-btn:not(:disabled):active {
  transform: scale(.98) translateY(0);
  filter: brightness(.96);
  box-shadow:
    inset 0 2px 6px rgba(0,0,0,.18),
    0 1px 8px rgba(200,240,0,.25);
}

/* ── Прогресс-бар: градиент + свечение ── */
.pbar-fill {
  background: linear-gradient(90deg, #8FC500 0%, #C8F000 100%);
  box-shadow: 0 0 6px rgba(200,240,0,.45);
}

/* ── Кнопка «Назад» ── */
.pbar-back {
  background: rgba(255,255,255,.04);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.pbar-back:hover {
  background: rgba(200,240,0,.08);
  border-color: rgba(200,240,0,.45) !important;
  color: #C8F000 !important;
}

/* ── Карточки выбора (.opt) — page 2-4, 8-12, 17-25 ── */
.opt {
  border-color: rgba(200,240,0,.22) !important;
  transition:
    border-color .18s,
    transform .15s,
    box-shadow .18s !important;
}
.opt:hover {
  border-color: rgba(200,240,0,.5) !important;
  box-shadow: 0 6px 24px rgba(0,0,0,.4), 0 0 0 1px rgba(200,240,0,.18);
  transform: translateY(-1px);
}
.opt.sel {
  border-color: #C8F000 !important;
  box-shadow:
    0 0 0 1px #C8F000,
    0 0 28px rgba(200,240,0,.16) !important;
}

/* ── Чекбокс (page 6, 17, 26) ── */
.chk,
.consent-chk {
  border-color: rgba(255,255,255,.28) !important;
  transition: background .18s, border-color .18s, box-shadow .18s !important;
}
.opt.sel .chk {
  background: linear-gradient(135deg, #C8F000, #9EC500) !important;
  border-color: #C8F000 !important;
  box-shadow: 0 0 10px rgba(200,240,0,.4);
}
.consent-box.checked .consent-chk,
.consent-box[data-checked="true"] .consent-chk {
  background: linear-gradient(135deg, #C8F000, #9EC500);
  border-color: #C8F000;
}

/* ── Галочка-бейдж (.opt-check) на карточках page 2-4 ── */
.opt-check {
  background: linear-gradient(135deg, #C8F000 0%, #9EC500 100%) !important;
  box-shadow: 0 2px 10px rgba(200,240,0,.35);
}

/* ── Поле ввода (page 26, 27) ── */
.inp-field:focus {
  border-color: #C8F000 !important;
  box-shadow: 0 0 0 3px rgba(200,240,0,.13);
}

/* ── Range-слайдер (page 5, 13) ── */
input[type=range]::-webkit-slider-thumb {
  background: linear-gradient(135deg, #C8F000 0%, #9EC500 100%) !important;
  box-shadow:
    0 0 0 4px rgba(200,240,0,.22),
    0 2px 8px rgba(0,0,0,.45) !important;
}
input[type=range]::-moz-range-thumb {
  background: linear-gradient(135deg, #C8F000 0%, #9EC500 100%) !important;
  box-shadow: 0 0 0 4px rgba(200,240,0,.22) !important;
}

/* ── Тултип слайдера (page 5) ── */
.slider-tooltip {
  background: linear-gradient(135deg, #C8F000 0%, #9EC500 100%);
  box-shadow: 0 2px 10px rgba(200,240,0,.3);
}
.slider-tooltip::after {
  border-top-color: #9EC500;
}

/* ── Активные точки трека (page 5) ── */
.dot.active {
  background: #C8F000;
  box-shadow: 0 0 6px rgba(200,240,0,.5);
}

/* ── Бейдж уровня слайдера (page 13 .sl-badge) ── */
.sl-badge {
  background: linear-gradient(135deg, #C8F000 0%, #9EC500 100%) !important;
  box-shadow: 0 2px 10px rgba(200,240,0,.35) !important;
}

/* ── Статистическая цифра (page 7, 16 .stat-num) ── */
.stat-num {
  text-shadow: 0 0 40px rgba(200,240,0,.25);
}

/* ── Разделитель (.divider) ── */
.divider {
  background: linear-gradient(90deg, #C8F000, rgba(200,240,0,0)) !important;
  height: 2px !important;
  border: none !important;
}

/* ── Check-иконки (.check-icon) — информационные, не кнопки ── */
.check-icon {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  width: 20px !important;
  height: 20px !important;
}
.check-icon svg {
  width: 16px !important;
  height: 16px !important;
}
.check-icon svg path {
  stroke: #C8F000 !important;
  stroke-width: 2.2px !important;
}

/* ── Подсказка / hint-box (page 4) ── */
.hint-box {
  border-color: rgba(200,240,0,.15) !important;
  background: rgba(200,240,0,.04) !important;
}
.hint-title {
  color: #C8F000 !important;
}

/* Быстрый отклик тапа на мобильных (убирает 300мс задержку клика) */
.opt, .cont-btn, .pbar-back, .pbar-login, button, .opt-text { touch-action: manipulation; }