{% set grouped = {} %}
{% for question in questions %}
    {% set key = question.section ? 'section_' ~ question.section.id : 'other' %}
    {% set grouped = grouped|merge({(key): (grouped[key]|default([]))|merge([question])}) %}
{% endfor %}
<div class="interview-tab-toolbar">
    <label><i class="ti ti-search"></i><input type="search" placeholder="Rechercher une question…" data-interview-detail-target="answerSearch" data-action="input->interview-detail#filterAnswers"></label>
    <select data-interview-detail-target="answerTheme" data-action="change->interview-detail#filterAnswers"><option value="">Toutes les thématiques</option>{% for section in template_sections %}<option value="{{ section.id }}">{{ section.titre }}</option>{% endfor %}</select>
    <div><span>Affichage :</span><button class="is-active" type="button" data-answer-mode="comparison" data-action="interview-detail#setAnswerMode">Comparatif</button><button type="button" data-answer-mode="employee" data-action="interview-detail#setAnswerMode">Salarié uniquement</button></div>
</div>
<div class="interview-answers" data-interview-detail-target="answers">
    {% for section in template_sections %}
        {% set section_key = 'section_' ~ section.id %}
        {% set rows = grouped[section_key]|default([]) %}
        {% if rows %}
            <section class="interview-answer-section" data-answer-section data-theme="{{ section.id }}">
                <header><span><i class="ti ti-history"></i></span><div><h2>{{ loop.index }}. {{ section.titre }}</h2>{% if section.description %}<p>{{ section.description }}</p>{% endif %}</div></header>
                {% for question in rows %}
                    {% set employee_answer = employee_answers[question.id]|default(null) %}
                    {% set manager_answer = manager_answers[question.id]|default(null) %}
                    {% set employee_value = employee_answer ? (employee_answer.answerJson ?: employee_answer.answerText) : null %}
                    {% set manager_value = manager_answer ? (manager_answer.answerJson ?: manager_answer.answerText) : null %}
                    <article class="interview-answer-card" data-answer-card data-search="{{ (question.label ~ ' ' ~ section.titre)|lower|e('html_attr') }}">
                        <header><small>Question {{ loop.parent.loop.index }}.{{ loop.index }}</small><strong>{{ question.label }}</strong></header>
                        <div>
                            <section><b><i class="ti ti-user"></i> Réponse de {{ employee.prenom }} <em>Salarié</em></b><p class="{{ employee_value is empty ? 'is-empty' : '' }}">{{ employee_value is iterable ? employee_value|join(', ') : (employee_value ?: 'Aucune réponse saisie.') }}</p></section>
                            <section data-manager-answer><b><i class="ti ti-user-tie"></i> Réponse de {{ interview.manager ?: 'Manager' }} <em>Manager</em></b><p class="{{ manager_value is empty ? 'is-empty' : '' }}">{{ manager_value is iterable ? manager_value|join(', ') : (manager_value ?: 'Le manager n’a pas encore saisi de réponse.') }}</p></section>
                        </div>
                    </article>
                {% endfor %}
            </section>
        {% endif %}
    {% endfor %}
    {% if grouped.other|default([]) %}
        <section class="interview-answer-section" data-answer-section data-theme="other">
            <header><span><i class="ti ti-message-question"></i></span><div><h2>Questions complémentaires</h2></div></header>
            {% for question in grouped.other %}
                {% set employee_answer = employee_answers[question.id]|default(null) %}{% set manager_answer = manager_answers[question.id]|default(null) %}
                {% set employee_value = employee_answer ? (employee_answer.answerJson ?: employee_answer.answerText) : null %}{% set manager_value = manager_answer ? (manager_answer.answerJson ?: manager_answer.answerText) : null %}
                <article class="interview-answer-card" data-answer-card data-search="{{ question.label|lower|e('html_attr') }}"><header><small>Question complémentaire {{ loop.index }}</small><strong>{{ question.label }}</strong></header><div><section><b><i class="ti ti-user"></i> Réponse de {{ employee.prenom }} <em>Salarié</em></b><p class="{{ employee_value is empty ? 'is-empty' : '' }}">{{ employee_value is iterable ? employee_value|join(', ') : (employee_value ?: 'Aucune réponse saisie.') }}</p></section><section data-manager-answer><b><i class="ti ti-user-tie"></i> Réponse de {{ interview.manager ?: 'Manager' }} <em>Manager</em></b><p class="{{ manager_value is empty ? 'is-empty' : '' }}">{{ manager_value is iterable ? manager_value|join(', ') : (manager_value ?: 'Le manager n’a pas encore saisi de réponse.') }}</p></section></div></article>
            {% endfor %}
        </section>
    {% endif %}
    {% if questions is empty %}<div class="data-empty"><i class="ti ti-message-off"></i><strong>Aucune question configurée</strong></div>{% endif %}
</div>