{# One FAQ question/answer row. Rendered for each existing pair and captured
   once as the CollectionType prototype (see _form.html.twig). #}
<div class="adm-faq-row" style="border:1.5px solid rgba(200,210,240,.6);border-radius:11px;padding:14px 14px 16px;margin-bottom:12px;background:rgba(255,255,255,.4)">

    <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px">
        <span class="adm-faq-row__num" style="font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)">Question</span>
        <div style="display:flex;gap:6px">
            <button type="button" class="adm-btn adm-btn-g adm-btn-sm" data-faq-move="up" title="Monter" aria-label="Monter cette question">
                <svg viewBox="0 0 24 24" style="width:13px;height:13px"><polyline points="18 15 12 9 6 15"/></svg>
            </button>
            <button type="button" class="adm-btn adm-btn-g adm-btn-sm" data-faq-move="down" title="Descendre" aria-label="Descendre cette question">
                <svg viewBox="0 0 24 24" style="width:13px;height:13px"><polyline points="6 9 12 15 18 9"/></svg>
            </button>
            <button type="button" class="adm-btn adm-btn-red adm-btn-sm" data-faq-remove title="Supprimer" aria-label="Supprimer cette question">
                <svg viewBox="0 0 24 24" style="width:13px;height:13px"><path d="M18 6L6 18M6 6l12 12"/></svg>
            </button>
        </div>
    </div>

    <div class="adm-field" style="margin-bottom:12px">
        <label for="{{ row.q.vars.id }}">Question</label>
        {{ form_widget(row.q) }}
        {{ form_errors(row.q) }}
    </div>

    <div class="adm-field">
        <label for="{{ row.a.vars.id }}">Réponse</label>
        {{ form_widget(row.a) }}
        {{ form_errors(row.a) }}
    </div>

</div>