<!-- Filter -->
<div class="admin-filter-bar" style="margin-bottom:20px">
  <select class="admin-select" onchange="window.location.href='?action='+this.value+'&page=1'">
    <option value="">All Actions</option>
    <% actions.forEach(a => { %><option value="<%= a %>" <%= action===a?'selected':'' %>><%= a %></option><% }) %>
  </select>
  <span style="font-size:.85rem;color:#9ca3af;margin-left:auto"><%= total.toLocaleString() %> log entries</span>
</div>

<div class="admin-card">
  <table class="admin-table">
    <thead><tr><th>Timestamp</th><th>User</th><th>Action</th><th>Entity</th><th>IP Address</th></tr></thead>
    <tbody>
      <% if (logs && logs.length) { %>
      <% logs.forEach(l => { %>
      <tr>
        <td style="font-size:.75rem;white-space:nowrap"><%= moment(l.created_at).format('MMM D, YYYY h:mm:ss A') %></td>
        <td style="font-size:.78rem">
          <% if (l.first_name) { %><%= l.first_name %> <%= l.last_name %><br><span style="color:#9ca3af"><%= l.email %></span>
          <% } else { %><span style="color:#9ca3af">System</span><% } %>
        </td>
        <td>
          <span class="badge badge-<%= l.action.includes('login')||l.action.includes('register')?'info':l.action.includes('delete')||l.action.includes('suspend')||l.action.includes('expire')?'danger':l.action.includes('update')||l.action.includes('extend')?'warning':'secondary' %>">
            <%= l.action %>
          </span>
        </td>
        <td style="font-size:.78rem">
          <% if (l.entity) { %><code style="font-size:.72rem;background:#f3f4f6;padding:2px 5px;border-radius:3px"><%= l.entity %><% if(l.entity_id) { %>#<%= l.entity_id %><% } %></code><% } else { %><span style="color:#9ca3af">—</span><% } %>
        </td>
        <td style="font-size:.72rem;color:#9ca3af"><%= l.ip_address || '—' %></td>
      </tr>
      <% }) %>
      <% } else { %>
      <tr><td colspan="5" style="text-align:center;padding:40px;color:#9ca3af">No audit logs found.</td></tr>
      <% } %>
    </tbody>
  </table>
</div>

<!-- Pagination -->
<% const totalPages = Math.ceil(total / limit); %>
<% if (totalPages > 1) { %>
<div class="pagination">
  <% if (page > 1) { %><a href="?action=<%= action %>&page=<%= page-1 %>" class="page-btn"><i class="bi bi-chevron-left"></i></a><% } %>
  <% for(let i=Math.max(1,page-3); i<=Math.min(totalPages,page+3); i++) { %><a href="?action=<%= action %>&page=<%= i %>" class="page-btn <%= i===page?'active':'' %>"><%= i %></a><% } %>
  <% if (page < totalPages) { %><a href="?action=<%= action %>&page=<%= page+1 %>" class="page-btn"><i class="bi bi-chevron-right"></i></a><% } %>
</div>
<% } %>
