/* ===== PsychoTest – общий стиль для всех тестов =====
   Работает с двумя наборами классов:
   - "pt-*"  — для универсального движка
   Настраиваемые переменные — измените под свою тему в :root.
*/
:root{
  --pt-font: Open Sans, sans-serif;
  --pt-bg-odd: #f4fcfa;
  --pt-bg-even: #26ABA3;
  --pt-even-text: #ffffff;
  --pt-card-bg: #ffffff;
  --pt-border: #eeeeee;
  --pt-error: #b00020;
  --pt-btn-bg: #0d6efd;
  --pt-btn-text: #ffffff;
  --pt-btn-sec-bg: #6c757d;
  --pt-scale-border: rgba(0,0,0,.08);
  --pt-radius: 12px;
  --pt-gap: 10px;
  --pt-pad: 14px;
}

/* Базовая обёртка */
.pt-wrap{
  font-family: var(--pt-font);
  line-height: 1.5;
  max-width: 900px;
}

.pt-title{
  font-size: 1.6rem;
  font-weight: 800;
  margin: 0 0 .5rem;
}

.pt-intro{
  color: #333;
  margin: 0 0 1rem;
}

/* Вопросы */
.pt-q{
  border: 1px solid var(--pt-border);
  border-radius: var(--pt-radius);
  padding: var(--pt-pad);
  margin: 10px 0;
}

/* Чередование фона */
.pt-q:nth-of-type(odd){
  background: var(--pt-bg-odd);
  color: #111;
}
.pt-q:nth-of-type(even){
  background: var(--pt-bg-even);
  color: var(--pt-even-text);
}
.pt-q:nth-of-type(even) legend,
.pt-q:nth-of-type(even) label{
  color: var(--pt-even-text);
}

/* Заголовок вопроса */
.pt-q legend{
  font-weight: 700;
  margin: 0 0 8px;
}

/* Варианты — каждый с новой строки */
.pt-opts{ display:block; }
.pt-opts label{
  display: block;
  margin: 6px 0;
  cursor: pointer;
}
.pt-opts input{ margin-right: .5rem; }

/* Ошибки */
.pt-err{
  color: var(--pt-error);
  font-size: .9rem;
  margin-top: 6px;
  display: none;
}
.pt-q.invalid .pt-err{ display:block; }

/* Кнопки / панель действий */
.pt-actions{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.pt-btn{
  appearance: none;
  border: 0;
  border-radius: 10px;
  padding: 10px 14px;
  background: var(--pt-btn-bg);
  color: var(--pt-btn-text);
  font-weight: 700;
  cursor: pointer;
}
.pt-btn.secondary{
  background: var(--pt-btn-sec-bg);
}

/* Результат и шкала */
.pt-result{
  margin-top: 18px;
  padding: var(--pt-pad);
  border: 1px solid #e8e8e8;
  border-radius: var(--pt-radius);
  background: var(--pt-card-bg);
}

.pt-scale{
  position: relative;
  display: flex;
  height: 18px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--pt-scale-border);
  margin: 8px 0 6px;
}
.pt-scale-seg{ height: 100%; }
.pt-scale-pointer{
  position: absolute;
  top: -4px;
  width: 2px;
  height: 26px;
  background: #111;
  box-shadow: 0 0 0 2px rgba(255,255,255,.9);
  transform: translateX(-50%);
}
.pt-scale-minmax{
  display: flex;
  justify-content: space-between;
  font-size: .85rem;
  color: #555;
}

.pt-zone-title{ font-weight: 800; margin: 8px 0 2px; }
.pt-zone-desc{ margin: 0; }

/* каждый вариант ответа в колонку */
.pt-opts label {
  display: block;       /* чтобы каждый вариант с новой строки */
  margin: 4px 0;        /* отступ сверху/снизу */
  cursor: pointer;
}

.pt-opts input[type="radio"],
.pt-opts input[type="checkbox"] {
  margin-right: 6px;    /* расстояние между кружком/чекбоксом и текстом */
}

/* субшкалы */
.pt-subscales{margin-top:10px;display:grid;grid-template-columns:1fr;gap:8px}
.pt-subscale{background:#f7f7f7;border-radius:8px;padding:8px 10px;border:1px solid #e6e6e6;color:#222}
.pt-subscale-title{font-weight:600;margin-bottom:2px}
.pt-subscale-score{font-size:.95em}
.pt-subscale-range{color:#666;font-size:.9em;margin-left:6px}
@media (min-width:640px){
  .pt-subscales{grid-template-columns:1fr 1fr}
}

/* Мелкая адаптивность */
@media (max-width: 520px){
  .pt-title{ font-size: 1.35rem; }
}