/* assessment.css — the patient-facing PRWE questionnaire (0-10 rating sliders). */

.prwe-section-title { margin: 22px 0 2px; font-size: 15.5px; color: var(--ink); }
.prwe-section-title:first-of-type { margin-top: 4px; }
.prwe-section-note { margin: 0 0 14px; font-size: 13px; color: var(--muted); }

.prwe-item { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.prwe-item label { font-size: 14.5px; color: var(--ink); }
.prwe-scale { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 10px; }
.prwe-scale-label { font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.prwe-scale input[type="range"] {
  width: 100%; accent-color: var(--accent);
}
.prwe-scale-value {
  min-width: 26px; text-align: center; font-variant-numeric: tabular-nums; font-weight: 700;
  color: var(--accent); font-size: 15px;
}

.credit-line { margin: 18px 4px; font-size: 11.5px; color: var(--muted); text-align: center; }

@media (max-width: 560px) {
  .prwe-scale { grid-template-columns: 1fr auto; grid-template-areas: "min max" "range range" "val val"; }
  .prwe-scale-label:first-child { grid-area: min; }
  .prwe-scale-label:last-of-type { grid-area: max; text-align: right; }
  .prwe-scale input[type="range"] { grid-area: range; }
  .prwe-scale-value { grid-area: val; }
}

/* unanswered questions are visibly "not answered yet" instead of silently counting as the best answer */
.prwe-progress { margin: 0 0 12px; font-size: 13.5px; font-weight: 650; color: var(--muted); }
.prwe-progress.is-complete { color: var(--good); }
.prwe-item { padding: 8px 10px; border-radius: 12px; border: 1px solid transparent; }
.prwe-item.is-unanswered input[type="range"] { opacity: .5; filter: grayscale(1); }
.prwe-item.is-unanswered .prwe-scale-value { color: var(--muted); }
.prwe-item.needs-answer { border-color: var(--warn); background: rgba(var(--warn-rgb), 0.10); }