{#
 # A submitted questionnaire response, read-only. Expects `definition` (the version the response
 # was submitted under) and `response`. Questions that are hidden or were left open are skipped;
 # an answer the definition does not know (an option key since renamed) is shown as stored rather
 # than dropped.
 #}
{% set answers = response.answers %}
<div class="flex flex-col gap-y-8">
    {% for section in definition.sections %}
        {% set shown = section.questions|filter(question => answers[question.key] is defined and definition.isVisible(question, answers)) %}
        {% if shown is not empty %}
            <section>
                {% if section.title %}
                    <h2 class="text-lg font-bold pb-2">
                        {{ section.title }}
                    </h2>
                {% endif %}
                <dl class="divide-y divide-gray-100">
                    {% for question in shown %}
                        {% set answer = answers[question.key] %}
                        <div class="py-4 sm:grid sm:grid-cols-2 sm:gap-4">
                            <dt class="text-sm font-bold leading-6 text-gray-900">
                                {{ question.label|nl2br }}
                            </dt>
                            <dd class="mt-1 text-sm leading-6 text-gray-700 sm:mt-0">
                                {% if question.type.value == 'rating' %}
                                    <span class="inline-flex items-center gap-x-2">
                                        <span class="inline-flex items-center">
                                            {% for grade in range(1, 5) %}
                                                {{ icon('star', html_classes('w-4 h-4', { 'text-gray-200': answer < grade, 'text-primary': answer >= grade })) }}
                                            {% endfor %}
                                        </span>
                                        {{ answer }} von 5
                                    </span>
                                {% elseif question.type.value == 'choice' %}
                                    {{ (question.option(answer).label ?? answer) }}
                                {% elseif question.type.value == 'multi' %}
                                    {{ answer|map(key => (question.option(key).label ?? key))|join(', ') }}
                                {% elseif question.type.value == 'date' %}
                                    {{ answer|date('d.m.Y') }}
                                {% else %}
                                    {{ answer|nl2br }}
                                {% endif %}
                            </dd>
                        </div>
                    {% endfor %}
                </dl>
            </section>
        {% endif %}
    {% endfor %}
</div>