@extends('layout.admin')
@section('content')

<style>
  .wrap{max-width:1100px;margin:0 auto;padding:14px}
  .card{background:#fff;border-radius:16px;border:1px solid #e2e8f0;box-shadow:0 10px 24px rgba(0,0,0,.04);overflow:hidden}
  .head{padding:14px 16px;border-bottom:1px solid #f1f5f9;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
  .btn{display:inline-flex;gap:8px;align-items:center;text-decoration:none;border:none;border-radius:12px;padding:10px 12px;font-weight:900;cursor:pointer}
  .btnSoft{background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe}
  .inp,.sel{border:1px solid #e2e8f0;border-radius:12px;padding:10px 12px;font-weight:800}
  table{width:100%;border-collapse:collapse}
  th,td{padding:12px;border-bottom:1px solid #f1f5f9;font-size:13px}
  th{text-align:left;color:#334155;font-weight:900;background:#f8fafc}
  .pill{padding:6px 10px;border-radius:999px;font-weight:900;font-size:12px;display:inline-block;background:#eff6ff;color:#1e40af;border:1px solid rgba(37,99,235,.18)}
</style>

<div class="wrap">
  <div class="card">
    <div class="head">
      <div style="font-weight:1000;color:#0f172a">Leadership Claims History</div>

      <form method="GET" style="display:flex;gap:10px;flex-wrap:wrap;align-items:center">
        <input class="inp" name="search" value="{{ request('search') }}" placeholder="name/email/referral_code">
        <select class="sel" name="rank_id">
          <option value="">All Ranks</option>
          @foreach($ranks as $r)
            <option value="{{ $r->id }}" @selected((string)request('rank_id')===(string)$r->id)>{{ $r->name }}</option>
          @endforeach
        </select>
        <button class="btn btnSoft" type="submit">Filter</button>
        <a class="btn btnSoft" href="{{ route('admin.leadership.ranks.index') }}">Ranks</a>
      </form>
    </div>

    <div style="overflow:auto">
      <table>
        <thead>
          <tr>
            <th>User</th>
            <th>Referral</th>
            <th>Rank</th>
            <th>Amount</th>
            <th>Claimed At</th>
          </tr>
        </thead>
        <tbody>
          @forelse($claims as $c)
            <tr>
              <td style="font-weight:900;color:#0f172a">
                {{ $c->user->name ?? 'N/A' }}
                <div style="font-size:12px;color:#64748b;font-weight:800">{{ $c->user->email ?? '' }}</div>
              </td>
              <td><span class="pill">{{ $c->user->referral_code ?? '' }}</span></td>
              <td><span class="pill">{{ $c->rank->name ?? 'N/A' }}</span></td>
              <td style="font-weight:1000;color:#1e40af">৳{{ number_format((float)$c->reward_amount,2) }}</td>
              <td>{{ $c->claimed_at?->format('d M Y, h:i A') }}</td>
            </tr>
          @empty
            <tr>
              <td colspan="5" style="text-align:center;color:#64748b;font-weight:900;padding:18px">No claims found.</td>
            </tr>
          @endforelse
        </tbody>
      </table>
    </div>

    <div style="padding:12px 16px">
      {{ $claims->links() }}
    </div>
  </div>
</div>
@endsection