{% extends "base.html" %}
{% block content %}
<div class="container-fluid mt-3">

  <div class="d-flex justify-content-between align-items-center mb-3">
    <h4 class="mb-0">
      <i class="bi bi-bank me-1"></i>
      Loan Admin Dashboard
    </h4>
    <div class="d-flex gap-2">
      <a href="{{ url_for('loan.admin_initiate_loan') }}" class="btn btn-primary btn-sm">
        <i class="bi bi-plus-circle"></i> Initiate Loan
      </a>
      <a href="{{ url_for('loan.loan_settings_admin') }}" class="btn btn-outline-secondary btn-sm">
        <i class="bi bi-gear"></i> Loan Settings
      </a>
      <a href="{{ url_for('loan.manage_loan_types') }}" class="btn btn-outline-primary btn-sm">
        <i class="bi bi-list-check"></i> Loan Types
      </a>
      <a href="{{ url_for('loan.admin_dashboard') }}" class="btn btn-outline-secondary btn-sm">
        <i class="bi bi-arrow-clockwise"></i> Refresh
      </a>
    </div>
  </div>

  <!-- Top metrics -->
  <div class="row g-3 mb-3">
    <div class="col-md-3">
      <div class="card shadow-sm h-100">
        <div class="card-body">
          <div class="d-flex justify-content-between">
            <div>
              <div class="text-muted small">Pending Approvals</div>
              <div class="fs-5 fw-semibold">{{ metrics.pending_count or 0 }}</div>
            </div>
            <div class="rounded-circle bg-warning-subtle p-2">
              <i class="bi bi-hourglass-split fs-4 text-warning"></i>
            </div>
          </div>
        </div>
      </div>
    </div><!-- col -->

    <div class="col-md-3">
      <div class="card shadow-sm h-100">
        <div class="card-body">
          <div class="d-flex justify-content-between">
            <div>
              <div class="text-muted small">Total Outstanding</div>
              <div class="fs-5 fw-semibold">₹{{ metrics.total_outstanding or 0 }}</div>
            </div>
            <div class="rounded-circle bg-primary-subtle p-2">
              <i class="bi bi-cash-stack fs-4 text-primary"></i>
            </div>
          </div>
        </div>
      </div>
    </div><!-- col -->

    <div class="col-md-3">
      <div class="card shadow-sm h-100">
        <div class="card-body">
          <div class="d-flex justify-content-between">
            <div>
              <div class="text-muted small">This Month EMI</div>
              <div class="fs-5 fw-semibold">₹{{ metrics.month_emi_total or 0 }}</div>
            </div>
            <div class="rounded-circle bg-info-subtle p-2">
              <i class="bi bi-calendar3 fs-4 text-info"></i>
            </div>
          </div>
        </div>
      </div>
    </div><!-- col -->

    <div class="col-md-3">
      <div class="card shadow-sm h-100">
        <div class="card-body">
          <div class="d-flex justify-content-between">
            <div>
              <div class="text-muted small">Overdue EMIs</div>
              <div class="fs-5 fw-semibold text-danger">{{ metrics.overdue_emi_count or 0 }}</div>
            </div>
            <div class="rounded-circle bg-danger-subtle p-2">
              <i class="bi bi-exclamation-triangle fs-4 text-danger"></i>
            </div>
          </div>
        </div>
      </div>
    </div><!-- col -->
  </div>

  <!-- ✅ Active Loan Summary Table -->
  <div class="card shadow-sm mb-3">
    <div class="card-header bg-light d-flex justify-content-between align-items-center">
      <span class="fw-semibold">
        <i class="bi bi-table me-1"></i> Active Loan Summary
      </span>
      <span class="small text-muted">Employee-wise snapshot (amount, paid, outstanding, next due, overdue)</span>
    </div>

    <div class="table-responsive">
      <table class="table table-sm table-hover align-middle mb-0">
        <thead class="table-light">
          <tr>
            <th>#</th>
            <th>Employee</th>
            <th>Department</th>
            <th>Loan Type</th>
            <th>Status</th>
            <th class="text-end">Amount</th>
            <th class="text-end">EMI</th>
            <th class="text-end">Paid</th>
            <th class="text-end">Outstanding</th>
            <th>Next Due</th>
            <th class="text-center">Overdue</th>
            <th class="text-end">Action</th>
          </tr>
        </thead>
        <tbody>
          {% if summary_rows %}
            {% for r in summary_rows %}
            {% set st = (r.status or '')|lower %}
            <tr class="{% if r.overdue_count and r.overdue_count > 0 %}table-danger{% endif %}">
              <td>{{ loop.index }}</td>

              <td>
                <div class="fw-semibold">{{ r.employee_name }}</div>
                <div class="small text-muted">{{ r.employee_code or '' }}</div>
              </td>

              <td>{{ r.department_name or '-' }}</td>
              <td>{{ r.loan_type or '-' }}</td>

              <td>
                {% if st in ['requested','under_review'] %}
                  <span class="badge bg-warning text-dark">Pending</span>
                {% elif st in ['approved','active'] %}
                  <span class="badge bg-success">Active</span>
                {% elif st == 'closed' %}
                  <span class="badge bg-secondary">Closed</span>
                {% elif st == 'rejected' %}
                  <span class="badge bg-danger">Rejected</span>
                {% elif st == 'cancelled' %}
                  <span class="badge bg-dark">Cancelled</span>
                {% else %}
                  <span class="badge bg-light text-dark">{{ r.status or '-' }}</span>
                {% endif %}
              </td>

              <td class="text-end">₹{{ "%.2f"|format(r.amount or 0) }}</td>
              <td class="text-end">₹{{ "%.2f"|format(r.emi or 0) }}</td>
              <td class="text-end">₹{{ "%.2f"|format(r.total_paid or 0) }}</td>
              <td class="text-end fw-semibold">₹{{ "%.2f"|format(r.outstanding or 0) }}</td>

              <td>
                {% if r.next_due_date %}
                  {{ r.next_due_date.strftime("%d-%m-%Y") }}
                {% else %}
                  -
                {% endif %}
              </td>

              <td class="text-center">
                {% if r.overdue_count and r.overdue_count > 0 %}
                  <span class="badge bg-danger">{{ r.overdue_count }}</span>
                {% else %}
                  <span class="badge bg-light text-dark">0</span>
                {% endif %}
              </td>

              <td class="text-end">
                <a href="{{ url_for('loan.admin_detail', loan_id=r.loan_id) }}"
                   class="btn btn-outline-primary btn-sm">
                  View
                </a>
              </td>
            </tr>
            {% endfor %}
          {% else %}
            <tr>
              <td colspan="12" class="text-center text-muted py-3">
                No active loans found.
              </td>
            </tr>
          {% endif %}
        </tbody>
      </table>
    </div>
  </div>

  <!-- (rest of your file unchanged below) -->

  <div class="row g-3">
    <!-- Pending approvals table -->
    <div class="col-lg-7">
      <div class="card shadow-sm h-100">
        <div class="card-header bg-light d-flex justify-content-between align-items-center">
          <span class="fw-semibold">
            <i class="bi bi-check2-square me-1"></i> Pending Loan Approvals
          </span>

          {# ✅ FIXED: real statuses + keep other filters #}
          <form class="d-flex gap-2 align-items-center"
                method="get"
                action="{{ url_for('loan.admin_dashboard') }}">

            <input type="hidden" name="emp" value="{{ request.args.get('emp','') }}">
            <input type="hidden" name="department_id" value="{{ request.args.get('department_id','') }}">
            <input type="hidden" name="status_filter" value="{{ request.args.get('status_filter','') }}">

            <select name="pending_status" class="form-select form-select-sm" style="max-width: 170px;">
              <option value="">All Pending</option>
              <option value="requested" {% if request.args.get('pending_status')=='requested' %}selected{% endif %}>
                Requested
              </option>
              <option value="under_review" {% if request.args.get('pending_status')=='under_review' %}selected{% endif %}>
                Under Review
              </option>
            </select>

            <button class="btn btn-outline-secondary btn-sm" type="submit">
              <i class="bi bi-filter"></i>
            </button>
          </form>
        </div>

        <div class="table-responsive">
          <table class="table table-sm table-hover mb-0">
            <thead class="table-light">
              <tr>
                <th>#</th>
                <th>Employee</th>
                <th>Loan Type</th>
                <th>Amount</th>
                <th>Applied On</th>
                <th></th>
              </tr>
            </thead>
            <tbody>
              {% if pending_loans %}
                {% for loan in pending_loans %}
                {% set display_amount = loan.sanctioned_amount if loan.sanctioned_amount is not none else loan.requested_amount %}
                <tr>
                  <td>{{ loop.index }}</td>
                  <td>
                    <div class="fw-semibold">{{ loan.employee.full_name }}</div>
                    <div class="small text-muted">
                      {{ loan.employee.employee_code }}
                      {% if loan.employee.department %}
                        &middot; {{ loan.employee.department.name }}
                      {% endif %}
                    </div>
                  </td>
                  <td>{{ loan.display_loan_type or loan.loan_type or "-" }}</td>
                  <td>₹{{ "%.2f"|format(display_amount or 0) }}</td>
                  <td>{{ loan.requested_on.strftime("%d-%m-%Y") if loan.requested_on else "-" }}</td>
                  <td class="text-end">
                    <a href="{{ url_for('loan.admin_detail', loan_id=loan.id) }}" class="btn btn-outline-primary btn-sm">
                      Review
                    </a>
                  </td>
                </tr>
                {% endfor %}
              {% else %}
                <tr>
                  <td colspan="6" class="text-center text-muted py-3">
                    No pending approvals.
                  </td>
                </tr>
              {% endif %}
            </tbody>
          </table>
        </div>
      </div>
    </div>

    <!-- Right: filters + overview list -->
    <div class="col-lg-5">
      <div class="card shadow-sm mb-3">
        <div class="card-header bg-light fw-semibold">
          Quick Filters
        </div>
        <div class="card-body">
          <form class="row g-2" method="get" action="{{ url_for('loan.admin_dashboard') }}">
            <div class="col-12">
              <label class="form-label small mb-1">Employee / Code</label>
              <input type="text" name="emp" class="form-control form-control-sm"
                     value="{{ request.args.get('emp','') }}"
                     placeholder="Search employee">
            </div>
            <div class="col-md-6">
              <label class="form-label small mb-1">Department</label>
              <select name="department_id" class="form-select form-select-sm">
                <option value="">All</option>
                {% for dept in departments %}
                  <option value="{{ dept.id }}"
                    {% if request.args.get('department_id')|int == dept.id %}selected{% endif %}>
                    {{ dept.name }}
                  </option>
                {% endfor %}
              </select>
            </div>
            <div class="col-md-6">
              <label class="form-label small mb-1">Status</label>
              <select name="status_filter" class="form-select form-select-sm">
                <option value="">All</option>
                <option value="approved" {% if request.args.get('status_filter')=='approved' %}selected{% endif %}>Approved / Active</option>
                <option value="active" {% if request.args.get('status_filter')=='active' %}selected{% endif %}>Active Only</option>
                <option value="closed" {% if request.args.get('status_filter')=='closed' %}selected{% endif %}>Closed</option>
                <option value="rejected" {% if request.args.get('status_filter')=='rejected' %}selected{% endif %}>Rejected</option>
              </select>
            </div>
            <div class="col-12 d-flex justify-content-end gap-2 mt-1">
              <button class="btn btn-outline-secondary btn-sm" type="submit">
                <i class="bi bi-search me-1"></i> Apply
              </button>
            </div>
          </form>
        </div>
      </div>

      <div class="card shadow-sm">
        <div class="card-header bg-light fw-semibold">
          Recent Loan Activity
        </div>
        <div class="list-group list-group-flush small" style="max-height: 260px; overflow-y: auto;">
          {% if recent_loans %}
            {% for loan in recent_loans %}
              {% set display_amount = loan.sanctioned_amount if loan.sanctioned_amount is not none else loan.requested_amount %}
              <div class="list-group-item">
                <div class="d-flex justify-content-between">
                  <div>
                    <div class="fw-semibold">{{ loan.employee.full_name }}</div>
                    <div class="text-muted">
                      {{ loan.display_loan_type or loan.loan_type or "Loan" }} &middot; ₹{{ "%.2f"|format(display_amount or 0) }}
                    </div>
                    <div class="text-muted">
                      <span class="me-2">
                        {{ loan.requested_on.strftime("%d-%m-%Y") if loan.requested_on else "-" }}
                      </span>
                      {% set st = (loan.status or '').lower() %}
                      {% if st in ['requested','under_review'] %}
                        <span class="badge bg-warning text-dark">Pending</span>
                      {% elif st in ['approved','active'] %}
                        <span class="badge bg-success">Approved / Active</span>
                      {% elif st == 'rejected' %}
                        <span class="badge bg-danger">Rejected</span>
                      {% elif st == 'closed' %}
                        <span class="badge bg-secondary">Closed</span>
                      {% endif %}
                    </div>
                  </div>
                  <div>
                    <a href="{{ url_for('loan.admin_detail', loan_id=loan.id) }}" class="btn btn-outline-primary btn-sm">
                      View
                    </a>
                  </div>
                </div>
              </div>
            {% endfor %}
          {% else %}
            <div class="list-group-item text-muted text-center">
              No recent activity.
            </div>
          {% endif %}
        </div>
      </div>
    </div>
  </div>

  {# NEW ROW: Skip EMI + Extra Payment Requests #}
  <div class="row g-3 mt-3">
    <!-- Skip EMI Requests -->
    <div class="col-lg-6">
      <div class="card shadow-sm h-100">
        <div class="card-header bg-light fw-semibold d-flex justify-content-between align-items-center">
          <span><i class="bi bi-skip-forward-circle me-1"></i> Skip EMI Requests</span>
        </div>
        <div class="table-responsive">
          <table class="table table-sm table-hover mb-0">
            <thead class="table-light">
              <tr>
                <th>#</th>
                <th>Employee</th>
                <th>EMI Month</th>
                <th>Amount</th>
                <th>Reason</th>
                <th class="text-end">Actions</th>
              </tr>
            </thead>
            <tbody>
            {% if skip_requests %}
              {% for r in skip_requests %}
              <tr>
                <td>{{ loop.index }}</td>
                <td>
                  <div class="fw-semibold">{{ r.loan.employee.full_name }}</div>
                  <div class="small text-muted">
                    {{ r.loan.employee.employee_code }}
                  </div>
                </td>
                <td>{{ r.request_month.strftime("%b %Y") if r.request_month else "-" }}</td>
                <td>₹{{ "%.2f"|format(r.emi.amount if r.emi and r.emi.amount else 0) }}</td>
                <td class="small">{{ r.reason or "-" }}</td>
                <td class="text-end">
                  <form method="post"
                        action="{{ url_for('loan.handle_skip_request', req_id=r.id) }}"
                        class="d-inline">
                    {% if csrf_token is defined %}{{ csrf_token() }}{% endif %}
                    <input type="hidden" name="decision" value="approve">
                    <input type="text"
                           name="remarks"
                           class="form-control form-control-sm mb-1"
                           placeholder="Remarks (optional)">
                    <button type="submit" class="btn btn-sm btn-success">
                      <i class="bi bi-check"></i>
                    </button>
                  </form>

                  <form method="post"
                        action="{{ url_for('loan.handle_skip_request', req_id=r.id) }}"
                        class="d-inline ms-1">
                    {% if csrf_token is defined %}{{ csrf_token() }}{% endif %}
                    <input type="hidden" name="decision" value="reject">
                    <button type="submit" class="btn btn-sm btn-outline-danger">
                      <i class="bi bi-x"></i>
                    </button>
                  </form>
                </td>
              </tr>
              {% endfor %}
            {% else %}
              <tr>
                <td colspan="6" class="text-center text-muted py-2">
                  No pending skip EMI requests.
                </td>
              </tr>
            {% endif %}
            </tbody>
          </table>
        </div>
      </div>
    </div>

    <!-- Extra Payment Requests -->
    <div class="col-lg-6">
      <div class="card shadow-sm h-100">
        <div class="card-header bg-light fw-semibold d-flex justify-content-between align-items-center">
          <span><i class="bi bi-plus-circle-dotted me-1"></i> Extra / Manual Payment Requests</span>
        </div>
        <div class="table-responsive">
          <table class="table table-sm table-hover mb-0">
            <thead class="table-light">
              <tr>
                <th>#</th>
                <th>Employee</th>
                <th>Amount</th>
                <th>Mode / Ref</th>
                <th class="text-end">Actions</th>
              </tr>
            </thead>
            <tbody>
            {% if extra_pay_requests %}
              {% for r in extra_pay_requests %}
              <tr>
                <td>{{ loop.index }}</td>
                <td>
                  <div class="fw-semibold">{{ r.loan.employee.full_name }}</div>
                  <div class="small text-muted">
                    {{ r.loan.employee.employee_code }}
                  </div>
                </td>
                <td>₹{{ "%.2f"|format(r.amount or 0) }}</td>
                <td class="small">
                  {{ r.payment_mode or "-" }}<br>
                  <span class="text-muted">{{ r.payment_ref or "" }}</span>
                </td>
                <td class="text-end">
                  <form method="post"
                        action="{{ url_for('loan.handle_extra_payment_request', req_id=r.id) }}"
                        class="d-inline">
                    {% if csrf_token is defined %}{{ csrf_token() }}{% endif %}
                    <input type="hidden" name="decision" value="approve">
                    <input type="text"
                           name="remarks"
                           class="form-control form-control-sm mb-1"
                           placeholder="Remarks (optional)">
                    <button type="submit" class="btn btn-sm btn-success">
                      <i class="bi bi-check"></i>
                    </button>
                  </form>

                  <form method="post"
                        action="{{ url_for('loan.handle_extra_payment_request', req_id=r.id) }}"
                        class="d-inline ms-1">
                    {% if csrf_token is defined %}{{ csrf_token() }}{% endif %}
                    <input type="hidden" name="decision" value="reject">
                    <button type="submit" class="btn btn-sm btn-outline-danger">
                      <i class="bi bi-x"></i>
                    </button>
                  </form>
                </td>
              </tr>
              {% endfor %}
            {% else %}
              <tr>
                <td colspan="5" class="text-center text-muted py-2">
                  No pending extra payment requests.
                </td>
              </tr>
            {% endif %}
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>

</div>
{% endblock %}