document.addEventListener('DOMContentLoaded', function () { var ratings = [ { range: 'question-3', steps: 'steps-q3' }, { range: 'question-4', steps: 'steps-q4' }, { range: 'question-5', steps: 'steps-q5' } ]; ratings.forEach(function (r) { var rangeEl = document.getElementById(r.range); var stepsEl = document.getElementById(r.steps); if (!rangeEl || !stepsEl) return; var spans = stepsEl.querySelectorAll('span'); function syncSteps(val) { spans.forEach(function (span) { span.classList.toggle('active', parseInt(span.getAttribute('data-val')) === val); }); } rangeEl.addEventListener('input', function () { syncSteps(parseInt(this.value)); }); spans.forEach(function (span) { span.addEventListener('click', function () { var v = parseInt(this.getAttribute('data-val')); rangeEl.value = v; syncSteps(v); }); }); syncSteps(parseInt(rangeEl.value)); }); // Conditional Q8 document.querySelectorAll('.question-7 input[type="radio"]').forEach(function (radio) { radio.addEventListener('change', function () { var q8 = document.getElementById('q8-wrap'); q8.style.display = this.value === 'Yes' ? 'block' : 'none'; if (this.value !== 'Yes') { var q8input = q8.querySelector('input'); if (q8input) q8input.value = ''; } }); }); });