{% extends "base.html" %}
{% block content %}

<style>
  .toolbar .form-select,
  .toolbar .form-control { min-width: 110px; }
  .stat-card {
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 1rem;
    padding: 1rem 1.25rem;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,.05);
    height: 100%;
  }
  .stat-kicker {
    font-size: .8rem; color: #6c757d; text-transform: uppercase;
    letter-spacing: .04em; margin-bottom: .25rem;
  }
  .table-responsive { max-height: 65vh; overflow: auto; }
  thead.table-dark th { position: sticky; top: 0; z-index: 2; }
  .badge-fnf { background: #ffe08a; color: #5c4200; }
  .cell-right { text-align: right; white-space: nowrap; }
  .cell-nowrap { white-space: nowrap; }
</style>

<div class="container-fluid py-4">

  <!-- Title + Toolbar -->
  <div class="d-flex flex-wrap align-items-end justify-content-between gap-3 mb-3">
    <div>
      <h4 class="mb-1">📊 Payroll Summary</h4>
      <div class="text-muted">Period: <strong>{{ "%02d"|format(month) }}/{{ year }}</strong></div>
    </div>

    <form method="get" class="toolbar d-flex align-items-end gap-2">
      <div>
        <label class="form-label mb-1">Month</label>
        <select name="month" class="form-select">
          {% for m in range(1, 13) %}
            <option value="{{ m }}" {% if m == month %}selected{% endif %}>{{ "%02d"|format(m) }}</option>
          {% endfor %}
        </select>
      </div>
      <div>
        <label class="form-label mb-1">Year</label>
        <select name="year" class="form-select">
          {% for y in range(2022, 2031) %}
            <option value="{{ y }}" {% if y == year %}selected{% endif %}>{{ y }}</option>
          {% endfor %}
        </select>
      </div>
      <div class="d-flex gap-2">
        <button type="submit" class="btn btn-primary">🔍 Filter</button>

        <a class="btn btn-outline-secondary"
           href="{{ url_for('payroll.consolidated_salary_view', month=year|string ~ '-' ~ '%02d'|format(month)) }}">
          📑 Consolidated
        </a>
        <a class="btn btn-outline-secondary"
           href="{{ url_for('payroll.download_consolidated_salary_excel', month=year|string ~ '-' ~ '%02d'|format(month)) }}">
          ⬇️ Excel
        </a>
        <a class="btn btn-outline-secondary"
           href="{{ url_for('payroll.download_disbursement_sheet', month=year|string ~ '-' ~ '%02d'|format(month)) }}">
          🏦 Disbursement
        </a>
      </div>
    </form>
  </div>

  <!-- Unfreeze MONTH (HR/Admin only) -->
  {% if total_employees > 0 and (current_user.role and current_user.role.name and current_user.role.name|lower in ['hr','admin']) %}
  <form method="POST" action="{{ url_for('payroll.unfreeze_month') }}"
        class="mb-3"
        onsubmit="return confirm('Unfreeze the entire month {{ '%04d-%02d'|format(year, month) }}? This will delete frozen data for ALL employees and re-enable preview. Continue?');">
    <input type="hidden" name="month" value="{{ '%04d-%02d'|format(year, month) }}">
    <div class="input-group" style="max-width: 640px;">
      <span class="input-group-text">Reason</span>
      <input type="text" name="reason" class="form-control" placeholder="Optional note for audit log">
      <button type="submit" class="btn btn-outline-danger">Unfreeze Month</button>
    </div>
  </form>
  {% endif %}

  <!-- Stats -->
  <div class="row g-3 mb-4">
    <div class="col-12 col-sm-6 col-lg-4">
      <div class="stat-card">
        <div class="stat-kicker">Total Employees</div>
        <div class="d-flex align-items-baseline gap-2">
          <div class="h3 mb-0">{{ total_employees }}</div>
          <span class="text-muted">employees</span>
        </div>
      </div>
    </div>
    <div class="col-12 col-sm-6 col-lg-4">
      <div class="stat-card">
        <div class="stat-kicker">Total Gross</div>
        <div class="h3 mb-0">₹{{ "{:,.2f}".format(total_gross or 0) }}</div>
      </div>
    </div>
    <div class="col-12 col-sm-6 col-lg-4">
      <div class="stat-card">
        <div class="stat-kicker">Total Net Pay</div>
        <div class="h3 mb-0">₹{{ "{:,.2f}".format(total_net or 0) }}</div>
      </div>
    </div>
  </div>

  <!-- Table -->
  <div class="table-responsive">
    <table class="table table-hover align-middle">
      <thead class="table-dark">
        <tr>
          <th class="cell-nowrap">#</th>
          <th class="cell-nowrap">Emp Code</th>
          <th>Employee</th>
          <th>Department</th>

          <th class="cell-nowrap text-center" title="Full-day present + 0.5 × half-days">
            Present
          </th>
          <th class="cell-nowrap text-center">Leave</th>
          <th class="cell-nowrap text-center">Weekends</th>
          <th class="cell-nowrap text-center">Holiday</th>
          <th class="cell-nowrap text-center">LWP</th>

          <!-- NEW: Paid Days -->
          <th class="cell-nowrap text-center" title="Present + Leave + Holiday + Weekend">
            Days (Paid)
          </th>

          <th class="cell-right">Gross</th>
          <th class="cell-right">Deductions</th>
          <th class="cell-right">Net Pay</th>
          <th class="cell-right">CTC</th>
          <th class="cell-nowrap">Status</th>
          <th class="cell-nowrap">Frozen On</th>
          <th class="cell-nowrap">Actions</th>
        </tr>
      </thead>
      <tbody>
        {% if records %}
          {% for r in records %}
            {% set row = r.record %}
            {% set paid_days = (row.present_days or 0) + (row.approved_leaves or 0) + (row.holidays or 0) + (row.weekends or 0) %}
            <tr>
              <td class="cell-nowrap">{{ loop.index }}</td>
              <td class="cell-nowrap">{{ row.employee.employee_code or '—' }}</td>
              <td>
                <div class="fw-semibold">{{ row.employee.full_name }}</div>
                {% if r.is_fnf %}
                  <span class="badge badge-fnf ms-0 mt-1">FnF</span>
                {% endif %}
              </td>
              <td class="text-muted">{{ row.employee.department.name if row.employee.department else '—' }}</td>

              <td class="text-center" title="Includes half-days as 0.5">
                {{ row.present_days|round(1) }}
              </td>
              <td class="text-center">{{ row.approved_leaves }}</td>
              <td class="text-center">{{ row.weekends }}</td>
              <td class="text-center">{{ row.holidays }}</td>
              <td class="text-center">{{ row.lwp_days }}</td>

              <!-- NEW: Paid Days -->
              <td class="text-center fw-semibold" title="Present + Leave + Holiday + Weekend">
                {{ "%.2f"|format(paid_days) }}
              </td>

              <td class="cell-right">₹{{ "{:,.2f}".format(row.gross_pay or 0) }}</td>
              <td class="cell-right">₹{{ "{:,.2f}".format(row.deductions or 0) }}</td>
              <td class="cell-right fw-semibold">₹{{ "{:,.2f}".format(row.net_pay or 0) }}</td>
              <td class="cell-right">₹{{ "{:,.2f}".format(row.ctc or 0) }}</td>

              <td class="cell-nowrap">
                {% set color = r.status_color or 'secondary' %}
                {% set label = r.status_label or 'Unknown' %}
                <span class="badge bg-{{ color }}">{{ label }}</span>
              </td>

              <td class="cell-nowrap">
                {{ row.freeze_date.strftime('%Y-%m-%d') if row.freeze_date else '—' }}
              </td>

              <td class="cell-nowrap">
                <div class="btn-group">
                  <a class="btn btn-sm btn-outline-primary"
                     href="{{ url_for('payroll.view_salary_slip', employee_id=row.employee.id, month=year|string ~ '-' ~ '%02d'|format(month)) }}">
                    View
                  </a>
                  <a class="btn btn-sm btn-outline-secondary"
                     href="{{ url_for('payroll.download_salary_slip_pdf', employee_id=row.employee.id, month=year|string ~ '-' ~ '%02d'|format(month)) }}">
                    PDF
                  </a>

                  {% if current_user.role and current_user.role.name and current_user.role.name|lower in ['hr','admin'] %}
                  <!-- NEW: per-employee Unfreeze -->
                  <form method="POST" action="{{ url_for('payroll.unfreeze_employee') }}"
                        class="d-inline"
                        onsubmit="return confirm('Unfreeze {{ row.employee.full_name }} for {{ '%04d-%02d'|format(year, month) }}?');">
                    <input type="hidden" name="month" value="{{ '%04d-%02d'|format(year, month) }}">
                    <input type="hidden" name="employee_id" value="{{ row.employee.id }}">
                    <input type="hidden" name="reason" value="">
                    <button type="submit" class="btn btn-sm btn-outline-danger">Unfreeze</button>
                  </form>
                  {% endif %}
                </div>
              </td>
            </tr>
          {% endfor %}
        {% else %}
          <tr>
            <td colspan="17" class="text-center py-5 text-muted">
              No records to display for {{ "%02d"|format(month) }}/{{ year }}.
            </td>
          </tr>
        {% endif %}
      </tbody>
    </table>
  </div>
</div>

{% endblock %}