<div class="max-w-7xl mx-auto">
  <div class="mb-6">
    <nav class="flex mb-4" aria-label="Breadcrumb">
      <ol class="inline-flex items-center space-x-1 text-sm font-medium md:space-x-2">
        <li class="inline-flex items-center">
          <%= link_to tenant_admin_auth_audit_logs_path, class: "inline-flex items-center text-gray-700 hover:text-blue-600" do %>
            <svg class="w-4 h-4 mr-1" fill="currentColor" viewBox="0 0 20 20">
              <path fill-rule="evenodd" d="M9.707 16.707a1 1 0 01-1.414 0l-6-6a1 1 0 010-1.414l6-6a1 1 0 011.414 1.414L5.414 9H17a1 1 0 110 2H5.414l4.293 4.293a1 1 0 010 1.414z" clip-rule="evenodd"></path>
            </svg>
            All Audit Logs
          <% end %>
        </li>
      </ol>
    </nav>
    <h1 class="text-3xl font-bold text-gray-900">Authentication History</h1>
    <p class="mt-2 text-gray-600">
      Activity for user:
      <%= link_to @user.email, tenant_admin_user_path(@user), class: "text-blue-600 hover:underline" %>
    </p>
  </div>

  <!-- User Info Card -->
  <div class="bg-white rounded-lg shadow p-4 mb-6">
    <div class="flex items-center space-x-4">
      <div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center text-blue-600 text-lg font-semibold">
        <%= @user.email[0].upcase %>
      </div>
      <div class="flex-1">
        <p class="font-medium text-gray-900"><%= @user.email %></p>
        <p class="text-sm text-gray-500">
          <% if @user.respond_to?(:admin) && @user.admin %>
            <span class="text-blue-600">Admin</span> |
          <% end %>
          Total Sign-ins: <%= @user.sign_in_count || 0 %> |
          Last Sign-in: <%= @user.last_sign_in_at ? time_ago_in_words(@user.last_sign_in_at) + " ago" : "Never" %>
          <% if @user.locked_at.present? %>
            | <span class="text-red-600 font-medium">Account Locked</span>
          <% end %>
        </p>
      </div>
      <%= link_to "View User Profile", tenant_admin_user_path(@user), class: "px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm" %>
    </div>
  </div>

  <!-- Logs Table -->
  <div class="bg-white rounded-lg shadow overflow-hidden">
    <table class="min-w-full divide-y divide-gray-200">
      <thead class="bg-gray-50">
        <tr>
          <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Time</th>
          <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Event</th>
          <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">IP Address</th>
          <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Details</th>
          <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
        </tr>
      </thead>
      <tbody class="bg-white divide-y divide-gray-200">
        <% if @logs.any? %>
          <% @logs.each do |log| %>
            <tr class="hover:bg-gray-50">
              <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-500">
                <div><%= log.created_at.strftime("%Y-%m-%d") %></div>
                <div class="text-xs text-gray-400"><%= log.created_at.strftime("%H:%M:%S") %></div>
              </td>
              <td class="px-4 py-3 whitespace-nowrap">
                <%= render partial: 'event_badge', locals: { event_type: log.event_type } %>
              </td>
              <td class="px-4 py-3 whitespace-nowrap text-sm">
                <% if log.ip_address.present? %>
                  <%= link_to log.ip_address, ip_tenant_admin_auth_audit_logs_path(ip: log.ip_address), class: "font-mono text-blue-600 hover:text-blue-800" %>
                <% else %>
                  <span class="text-gray-400">N/A</span>
                <% end %>
              </td>
              <td class="px-4 py-3 text-sm text-gray-500 max-w-xs truncate">
                <% if log.failure_reason.present? %>
                  <span class="text-red-600"><%= log.failure_reason %></span>
                <% elsif log.provider.present? %>
                  <span>Provider: <%= log.provider %></span>
                <% end %>
              </td>
              <td class="px-4 py-3 whitespace-nowrap text-sm">
                <%= link_to "View", tenant_admin_auth_audit_log_path(log), class: "text-blue-600 hover:text-blue-800" %>
              </td>
            </tr>
          <% end %>
        <% else %>
          <tr>
            <td colspan="5" class="px-6 py-12 text-center">
              <p class="text-gray-500">No authentication events found for this user.</p>
            </td>
          </tr>
        <% end %>
      </tbody>
    </table>

    <% if @logs.any? %>
      <div class="px-4 py-3 bg-gray-50 border-t border-gray-200">
        <%= render 'shared/pagination', pagy: @pagy %>
      </div>
    <% end %>
  </div>
</div>
