{# Tableau à cocher des dossiers prêts pour un lot. Paramètre : ready #}
<div class="overflow-x-auto rounded-lg border border-slate-200">
    <table class="min-w-full divide-y divide-slate-200 text-sm">
        <thead class="bg-slate-50 text-left text-xs font-semibold uppercase tracking-wider text-slate-500">
            <tr>
                <th class="w-10 px-4 py-2"><input type="checkbox" class="rounded border-slate-300" onclick="this.closest('table').querySelectorAll('tbody input[type=checkbox]').forEach(c => c.checked = this.checked)" aria-label="Tout sélectionner"></th>
                <th class="px-4 py-2">Dossier</th>
                <th class="px-4 py-2">Client</th>
                <th class="px-4 py-2">Agent</th>
                <th class="px-4 py-2">Validation reçue</th>
            </tr>
        </thead>
        <tbody class="divide-y divide-slate-100">
            {% for dossier in ready %}
                <tr class="hover:bg-slate-50">
                    <td class="px-4 py-2"><input type="checkbox" name="dossiers[]" value="{{ dossier.id }}" id="d{{ dossier.id }}" class="rounded border-slate-300"></td>
                    <td class="px-4 py-2"><label for="d{{ dossier.id }}" class="font-medium text-slate-900">{{ dossier.reference }}</label></td>
                    <td class="px-4 py-2">{{ dossier.client.fullName }} <span class="font-mono text-xs text-slate-500">{{ dossier.client.passportNumber }}</span></td>
                    <td class="px-4 py-2 text-slate-600">{{ dossier.assignedAgent ? dossier.assignedAgent.fullName : '—' }}</td>
                    <td class="px-4 py-2 text-slate-600">{{ dossier.validationReceivedAt ? dossier.validationReceivedAt|date('d/m/Y') : '—' }}</td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
</div>