<div class="admin-page">
  <div class="admin-page-head">
    <h1><%= member.name %></h1>
    <a href="/admin/users" class="btn btn-ghost">← Retour à la liste</a>
  </div>

  <div class="admin-cols">
    <!-- Infos & état -->
    <div class="admin-panel">
      <h2>Informations</h2>
      <table class="kv-table">
        <tr><th>ID</th><td>#<%= member.id %></td></tr>
        <tr><th>Nom</th><td><%= member.name %></td></tr>
        <tr><th>Email</th><td><%= member.email %></td></tr>
        <tr><th>Rôle</th><td><%= member.role %></td></tr>
        <tr><th>Inscrit le</th><td><%= fmtDateTime(member.created_at) %></td></tr>
        <tr><th>État</th><td>
          <% if (member.is_blocked) { %>
            <span class="badge-mini badge-off">Bloqué</span>
          <% } else { %>
            <span class="badge-mini badge-on">Actif</span>
          <% } %>
        </td></tr>
        <tr><th>Accès VIP</th><td>
          <% if (access.hasAccess) { %>
            <span class="badge-mini badge-on"><%= access.planLabel %></span>
            <% if (access.expiresAt) { %> — jusqu'au <%= fmtDate(access.expiresAt) %><% } %>
          <% } else { %>
            <span class="muted">Aucun accès actif</span>
          <% } %>
        </td></tr>
      </table>

      <% if (member.role !== 'admin') { %>
        <hr class="panel-sep" />
        <form action="/admin/users/<%= member.id %>/block" method="post" class="inline-form"
              data-confirm="<%= member.is_blocked ? 'Débloquer ce compte ?' : 'Bloquer ce compte ? L\'utilisateur ne pourra plus se connecter.' %>">
          <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
          <input type="hidden" name="block" value="<%= member.is_blocked ? '0' : '1' %>" />
          <button type="submit" class="btn <%= member.is_blocked ? 'btn-outline' : 'btn-danger' %>">
            <%= member.is_blocked ? 'Débloquer le compte' : 'Bloquer le compte' %>
          </button>
        </form>
      <% } %>
    </div>

    <!-- Gestion de l'accès -->
    <div class="admin-panel">
      <h2>Gérer l'accès VIP</h2>
      <p class="muted">Fixez manuellement une date d'expiration ou révoquez l'accès.</p>
      <form action="/admin/users/<%= member.id %>/access" method="post" class="form">
        <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
        <input type="hidden" name="action" value="grant" />
        <div class="field">
          <label for="expires_at">Accès valable jusqu'au</label>
          <input type="datetime-local" id="expires_at" name="expires_at"
                 value="<%= access.expiresAt ? fmtDateTimeLocal(access.expiresAt) : '' %>" required />
        </div>
        <button type="submit" class="btn btn-primary">Accorder / prolonger l'accès</button>
      </form>

      <hr class="panel-sep" />
      <form action="/admin/users/<%= member.id %>/access" method="post" class="inline-form"
            data-confirm="Révoquer immédiatement tous les accès VIP de ce membre ?">
        <input type="hidden" name="_csrf" value="<%= csrfToken %>" />
        <input type="hidden" name="action" value="revoke" />
        <button type="submit" class="btn btn-outline">Révoquer l'accès</button>
      </form>
    </div>
  </div>

  <!-- Abonnements -->
  <div class="admin-panel">
    <h2>Abonnements / accès</h2>
    <% if (!subscriptions.length) { %>
      <p class="muted">Aucun enregistrement.</p>
    <% } else { %>
      <div class="table-wrap">
        <table class="data-table">
          <thead><tr><th>Offre</th><th>Statut</th><th>Début</th><th>Expire</th><th>Résiliation prog.</th><th>Stripe</th></tr></thead>
          <tbody>
            <% subscriptions.forEach(function(s){ %>
              <tr>
                <td><%= planLabels[s.plan_type] || s.plan_type %></td>
                <td><%= s.status %></td>
                <td><%= fmtDate(s.started_at) %></td>
                <td><%= s.expires_at ? fmtDateTime(s.expires_at) : '—' %></td>
                <td><%= s.cancel_at_period_end ? 'Oui' : 'Non' %></td>
                <td class="cell-mono"><%= s.stripe_subscription_id || '—' %></td>
              </tr>
            <% }) %>
          </tbody>
        </table>
      </div>
    <% } %>
  </div>

  <!-- Paiements -->
  <div class="admin-panel">
    <h2>Paiements</h2>
    <% if (!payments.length) { %>
      <p class="muted">Aucun paiement.</p>
    <% } else { %>
      <div class="table-wrap">
        <table class="data-table">
          <thead><tr><th>Date</th><th>Offre</th><th>Montant</th><th>Statut</th></tr></thead>
          <tbody>
            <% payments.forEach(function(p){ %>
              <tr>
                <td><%= fmtDateTime(p.created_at) %></td>
                <td><%= p.plan_type %></td>
                <td><%= fmtPrice(p.amount_cents) %></td>
                <td><%= p.status %></td>
              </tr>
            <% }) %>
          </tbody>
        </table>
      </div>
    <% } %>
  </div>
</div>
