<div class="grid">
  <%= render Components::Backend::Card.new(title: "dashboard") do %>
    <div class="section">
      <div class="section-header">
        <h3>verification stats</h3>
        <%= form_tag backend_dashboard_path, method: :get do %>
          <%= select_tag :time_period,
              options_for_select([
                ["today", "today"],
                ["this month", "this_month"],
                ["all time", "all_time"]
              ], @time_period),
              onchange: "this.form.submit()" %>
        <% end %>
      </div>
      <div class="section-content">
        <div class="stats-grid">
          <div class="stat">
            <div class="stat-value"><%= @stats[:total] %></div>
            <div class="stat-label">total</div>
          </div>
          <div class="stat">
            <div class="stat-value" style="color: var(--color-green-50);"><%= @stats[:approved] %></div>
            <div class="stat-label">approved</div>
          </div>
          <div class="stat">
            <div class="stat-value" style="color: var(--color-red-50);"><%= @stats[:rejected] %></div>
            <div class="stat-label">rejected</div>
          </div>
          <div class="stat">
            <div class="stat-value" style="color: var(--color-daybreak);"><%= @stats[:pending] %></div>
            <div class="stat-label">pending</div>
          </div>
          <div class="stat">
            <div class="stat-value"><%= distance_of_time_in_words 0, (@stats[:average_hangtime] || 0) %></div>
            <div class="stat-label">avg wait</div>
          </div>
        </div>
      </div>
    </div>
    <hr>
    <div class="two-col">
      <div class="section">
        <div class="section-header"><h3>🏆 leaderboard</h3></div>
        <div class="section-content">
          <% if @leaderboard.any? %>
            <table>
              <thead>
                <tr>
                  <th>#</th>
                  <th>user</th>
                  <th>processed</th>
                </tr>
              </thead>
              <tbody>
                <% @leaderboard.each_with_index do |entry, index| %>
                  <tr>
                    <td><%= index == 0 ? "🥇" : index == 1 ? "🥈" : index + 1 %></td>
                    <td><%= render entry[:user] %></td>
                    <td><b><%= entry[:processed_count] %></b></td>
                  </tr>
                <% end %>
              </tbody>
            </table>
          <% else %>
            <div class="empty-state">no activity yet</div>
          <% end %>
        </div>
      </div>
      <div class="section">
        <div class="section-header"><h3>📊 rejection reasons</h3></div>
        <div class="section-content">
          <% if @rejection_breakdown.any? %>
            <table>
              <thead>
                <tr>
                  <th>reason</th>
                  <th>count</th>
                  <th>%</th>
                </tr>
              </thead>
              <tbody>
                <% total_rejected = @stats[:rejected] %>
                <% @rejection_breakdown.each do |reason, data| %>
                  <tr>
                    <td>
                      <%= reason %>
                      <% if data[:fatal] %>
                        <span class="badge danger">fatal</span>
                      <% end %>
                    </td>
                    <td><b><%= data[:count] %></b></td>
                    <td><%= total_rejected > 0 ? "#{(data[:count].to_f / total_rejected * 100).round(1)}%" : "0%" %></td>
                  </tr>
                <% end %>
              </tbody>
            </table>
          <% else %>
            <div class="empty-state">no rejections</div>
          <% end %>
        </div>
      </div>
    </div>
    <hr>
    <div class="section">
      <div class="section-content">
        <% if @rejections_by_country.any? %>
          <table>
            <thead>
              <tr>
                <th>country</th>
                <th>fatal</th>
                <th>total rejected</th>
                <th>fatal %</th>
                <th>breakdown</th>
              </tr>
            </thead>
            <tbody>
              <% @rejections_by_country.each do |country, data| %>
                <% next if data[:fatal] == 0 %>
                <tr>
                  <td><b><%= country %></b></td>
                  <td style="color: var(--color-red-50);"><b><%= data[:fatal] %></b></td>
                  <td><%= data[:total] %></td>
                  <td>
                    <% if data[:fatal_rate] >= 50 %>
                      <span class="badge danger"><%= data[:fatal_rate] %>%</span>
                    <% elsif data[:fatal_rate] >= 25 %>
                      <span class="badge warning"><%= data[:fatal_rate] %>%</span>
                    <% else %>
                      <%= data[:fatal_rate] %>%
                    <% end %>
                  </td>
                  <td>
                    <details>
                      <summary>view all</summary>
                      <ul style="margin: 0.5rem 0 0 1rem; padding: 0;">
                        <% data[:reasons].each do |reason, r| %>
                          <li>
                            <%= reason %>: <%= r[:count] %>
                            <% if r[:fatal] %><span class="badge danger">fatal</span><% end %>
                          </li>
                        <% end %>
                      </ul>
                    </details>
                  </td>
                </tr>
              <% end %>
            </tbody>
          </table>
        <% else %>
          <div class="empty-state">none</div>
        <% end %>
      </div>
    </div>
  <% end %>
</div>
