{% extends "base_authenticated.html" %}
{% block title %}Legacy Attendance Dashboard - {{ COMPANY_NAME }}{% endblock %}

{% block extra_head %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/time_attendance.css') }}">
{% endblock %}

{% block content %}
<div class="time-attendance-page">
  <!-- Page Header -->
  <div class="time-attendance-header">
    <div class="header-content">
      <h1>
        <i class="fas fa-history"></i>
        Legacy Attendance Dashboard
      </h1>
      <p class="header-description">Live view of attendance records from the legacy database</p>
    </div>

    <div class="header-actions">
      <a href="{{ url_for('legacy_attendance.legacy_attendance_records') }}" class="btn btn-primary">
        <i class="fas fa-search"></i>
        View All Records
      </a>
    </div>
  </div>

  <!-- Statistics Section -->
  <div class="stats-grid">
    <div class="stat-card">
      <div class="stat-icon records">
        <i class="fas fa-database"></i>
      </div>
      <div class="stat-info">
        <h3>{{ "{:,}".format(stats.total_records or 0) }}</h3>
        <p>Total Records</p>
      </div>
    </div>

    <div class="stat-card">
      <div class="stat-icon employees">
        <i class="fas fa-users"></i>
      </div>
      <div class="stat-info">
        <h3>{{ "{:,}".format(stats.unique_employees or 0) }}</h3>
        <p>Employees</p>
      </div>
    </div>

    <div class="stat-card">
      <div class="stat-icon locations">
        <i class="fas fa-map-marker-alt"></i>
      </div>
      <div class="stat-info">
        <h3>{{ "{:,}".format(stats.unique_locations or 0) }}</h3>
        <p>Locations</p>
      </div>
    </div>

    <div class="stat-card">
      <div class="stat-icon imports">
        <i class="fas fa-calendar-alt"></i>
      </div>
      <div class="stat-info">
        <h3>
          {% if stats.earliest_record and stats.latest_record %}
            {{ stats.earliest_record.strftime('%m/%d/%Y') }} &ndash; {{ stats.latest_record.strftime('%m/%d/%Y') }}
          {% else %}
            &mdash;
          {% endif %}
        </h3>
        <p>Date Range</p>
      </div>
    </div>
  </div>

  <div class="empty-state">
    <div class="empty-icon">
      <i class="fas fa-info-circle"></i>
    </div>
    <h3>This page reads live from the legacy database</h3>
    <p>
      Records are queried directly from the old attendance system on each visit &mdash;
      nothing is imported or stored locally. Use
      <a href="{{ url_for('legacy_attendance.legacy_attendance_records') }}">View All Records</a>
      to search, filter, and export.
    </p>
  </div>
</div>
{% endblock %}