{% extends 'admin/base_admin.html.twig' %}

{% block title %}Admin Mon Actu — NUM-ECARD{% endblock %}

{% block content %}
<div class="page-header">
    <h1 class="page-title">📣 Mon Actu — Gestion admin</h1>
    <p class="page-subtitle">Publiez des actualités pour vos clients Premium, Force de Vente et Multi</p>
</div>

{# Recherche #}
<form method="get" style="display:flex;gap:10px;margin-bottom:24px;">
    <input type="text" name="search" value="{{ search }}" placeholder="Rechercher un client…"
           style="flex:1;background:white;border:1px solid #e5e5ea;border-radius:10px;padding:10px 14px;font-size:14px;color:#1d1d1f;outline:none;">
    <button type="submit" style="padding:10px 20px;background:#007aff;color:white;border:none;border-radius:10px;font-family:monospace;font-size:12px;cursor:pointer;">Rechercher</button>
    {% if search %}<a href="{{ path('app_admin_actu_index') }}" style="padding:10px 16px;background:#f5f5f7;color:#86868b;border-radius:10px;font-size:12px;text-decoration:none;display:flex;align-items:center;">✕</a>{% endif %}
</form>

<div class="card">
    {% if beneficiaires is empty %}
        <div style="text-align:center;padding:60px 20px;">
            <div style="font-size:48px;margin-bottom:16px;">📣</div>
            <h2 style="font-size:20px;color:#1d1d1f;margin-bottom:8px;">Aucun client avec Mon Actu</h2>
            <p style="color:#86868b;font-size:14px;">Les clients Premium, Force de Vente et Multi apparaîtront ici.</p>
        </div>
    {% else %}
        <div class="table-container">
            <table class="admin-table">
                <thead>
                    <tr>
                        <th>Client / Carte</th>
                        <th>Pack</th>
                        <th>Posts publiés</th>
                        <th>Brouillons</th>
                        <th class="text-center">Action</th>
                    </tr>
                </thead>
                <tbody>
                {% for b in beneficiaires %}
                    <tr>
                        <td>
                            <strong style="font-size:14px;color:#1d1d1f;">{{ b.prenom }} {{ b.nom }}</strong>
                            <div style="font-size:12px;color:#86868b;margin-top:2px;">
                                {{ b.commande.clientEmail }}
                                {% if b.commande.clientEntreprise %} · {{ b.commande.clientEntreprise }}{% endif %}
                            </div>
                        </td>
                        <td>
                            {% set pack = b.commande.packType %}
                            {% if 'force' in pack %}
                                <span style="display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:rgba(191,90,242,.1);color:#bf5af2;border-radius:6px;font-size:12px;font-weight:600;">Force de Vente</span>
                            {% elseif 'multi' in pack %}
                                <span style="display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:rgba(255,159,10,.1);color:#ff9500;border-radius:6px;font-size:12px;font-weight:600;">Multi</span>
                            {% else %}
                                <span style="display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:rgba(0,122,255,.1);color:#007aff;border-radius:6px;font-size:12px;font-weight:600;">Premium</span>
                            {% endif %}
                        </td>
                        <td style="font-family:monospace;font-size:13px;color:#1d1d1f;">
                            {# Idéalement injecté depuis le controller via une query — simplifié ici #}
                            —
                        </td>
                        <td style="font-family:monospace;font-size:13px;color:#86868b;">—</td>
                        <td class="text-center">
                            <a href="{{ path('app_admin_actu_new', {beneficiaireId: b.id}) }}"
                               style="display:inline-flex;align-items:center;gap:6px;padding:7px 14px;background:#007aff;color:white;border-radius:8px;font-family:monospace;font-size:11px;text-decoration:none;font-weight:600;">
                                + Publier
                            </a>
                        </td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
        <div style="padding:12px 16px;color:#86868b;font-size:13px;border-top:1px solid #f0f0f5;">
            <strong>{{ beneficiaires|length }}</strong> client{{ beneficiaires|length > 1 ? 's' : '' }} avec Mon Actu
        </div>
    {% endif %}
</div>
{% endblock %}