@extends('backend.master')
@section('title','Loan Admin – Dashboard')

@push('styles')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css"/>
<style>
.card{border-radius:16px;background:#fff;box-shadow:0 10px 24px rgba(0,0,0,.06);border:1px solid rgba(2,8,23,.06)}
.badge{display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;padding:.25rem .6rem;font-weight:700;font-size:11px;border:1px solid transparent}
.badge-pending{background:#fff7ed;color:#c2410c;border-color:#fed7aa}
.btn{display:inline-flex;align-items:center;gap:.45rem;border-radius:999px;padding:.55rem .9rem;font-weight:800;color:#fff;background:linear-gradient(90deg,#6366f1,#06b6d4)}
.table{width:100%;border-collapse:separate;border-spacing:0}
.table th,.table td{padding:.7rem .6rem;border-bottom:1px solid #eef2f7;font-size:14px}
.table th{background:#f8fafc;text-align:left;font-weight:800;color:#1f2937}
</style>
@endpush

@section('content')
<div class="mx-auto max-w-6xl px-4 py-6 space-y-6">

  @if(session('success'))
    <div class="rounded-xl border border-emerald-200 bg-emerald-50 px-3 py-3 text-sm text-emerald-800">
      <i class="fa-solid fa-circle-check"></i> {{ session('success') }}
    </div>
  @endif

  {{-- Row 1: Users who took loans --}}
  <div class="card p-5">
    <div class="mb-3 flex items-center gap-2">
      <div class="h-9 w-9 rounded-xl bg-indigo-500 text-white flex items-center justify-center">
        <i class="fa-solid fa-users"></i>
      </div>
      <div class="text-lg font-extrabold text-slate-900">Users who took loans</div>
    </div>

    <div class="overflow-x-auto">
      <table class="table">
        <thead>
          <tr>
            <th>User</th>
            <th>Total Loans</th>
            <th>Running</th>
            <th>Completed (Paid)</th>
          </tr>
        </thead>
        <tbody>
          @forelse($users as $u)
            <tr>
              <td class="font-semibold text-slate-800">{{ $u->name }} <div class="text-xs text-slate-500">{{ $u->email }}</div></td>
              <td>{{ $u->total_loans }}</td>
              <td>{{ $u->running_loans }}</td>
              <td>{{ $u->completed_loans }}</td>
            </tr>
          @empty
            <tr><td colspan="4" class="text-sm text-slate-500 py-4">No users with loans.</td></tr>
          @endforelse
        </tbody>
      </table>
    </div>

    <div class="mt-3">{{ $users->links() }}</div>
  </div>

  {{-- Row 2: Installments to approve --}}
  <div class="card p-5">
    <div class="mb-3 flex items-center gap-2">
      <div class="h-9 w-9 rounded-xl bg-amber-500 text-white flex items-center justify-center">
        <i class="fa-solid fa-bell"></i>
      </div>
      <div class="text-lg font-extrabold text-slate-900">Installments pending approval</div>
      <span class="badge badge-pending ms-2"><i class="fa-regular fa-clock"></i> {{ $pendingInstallments->total() }}</span>
    </div>

    <div class="overflow-x-auto">
      <table class="table">
        <thead>
          <tr>
            <th>Installment</th>
            <th>User</th>
            <th>Loan</th>
            <th>Amount</th>
            <th>Method / Trx</th>
            <th>Submitted</th>
            <th>Action</th>
          </tr>
        </thead>
        <tbody>
        @forelse($pendingInstallments as $ins)
          <tr>
            <td>#{{ $ins->id }}</td>
            <td>{{ $ins->loan->user->name }}</td>
            <td>#{{ $ins->loan_id }}</td>
            <td>৳ {{ number_format($ins->paid_amount ?? $ins->amount) }}</td>
            <td>{{ strtoupper($ins->payment_method ?? '-') }} / {{ $ins->payment_trx_id ?? '-' }}</td>
            <td>{{ optional($ins->paid_at)->format('d M Y, h:i A') ?? $ins->created_at->format('d M Y, h:i A') }}</td>
            <td>
              <form method="POST" action="{{ route('admin.installments.approve', $ins) }}">
                @csrf
                <button class="btn"><i class="fa-solid fa-badge-check"></i> Approve</button>
              </form>
            </td>
          </tr>
        @empty
          <tr><td colspan="7" class="text-sm text-slate-500 py-4">No pending submissions.</td></tr>
        @endforelse
        </tbody>
      </table>
    </div>

    <div class="mt-3">{{ $pendingInstallments->links() }}</div>
  </div>
</div>
@endsection