@extends('layouts.admin')

@section('content')
<div class="row mb-3 g-3">

  {{-- ================= CLAIMS KPI COUNTS ================= --}}
  <div class="col-sm-6 col-md-4">
    <div class="card overflow-hidden">
      <div class="bg-holder bg-card"></div>
      <div class="card-body position-relative">
        <h6>Claims Processed (This Month)</h6>
        <div class="display-4 fs-4 fw-normal text-primary">
          {{ $claimsMonth }}
        </div>
        <small class="text-muted">Approved + Rejected</small>
      </div>
    </div>
  </div>

  <div class="col-sm-6 col-md-4">
    <div class="card overflow-hidden">
      <div class="bg-holder bg-card"></div>
      <div class="card-body position-relative">
        <h6>Claims Processed (This Quarter)</h6>
        <div class="display-4 fs-4 fw-normal text-info">
          {{ $claimsQuarter }}
        </div>
        <small class="text-muted">Approved + Rejected</small>
      </div>
    </div>
  </div>

  <div class="col-sm-6 col-md-4">
    <div class="card overflow-hidden">
      <div class="bg-holder bg-card"></div>
      <div class="card-body position-relative">
        <h6>Claims Processed (This Year)</h6>
        <div class="display-4 fs-4 fw-normal text-success">
          {{ $claimsYear }}
        </div>
        <small class="text-muted">Approved + Rejected</small>
      </div>
    </div>
  </div>

  {{-- ================= CLAIM VALUES ================= --}}
  <div class="col-sm-6 col-md-4">
    <div class="card overflow-hidden">
      <div class="bg-holder bg-card"></div>
      <div class="card-body position-relative">
        <h6>Claims Value (Month)</h6>
        <div class="display-4 fs-4 fw-normal text-success">
          {{ number_format($valueMonth, 2) }}
        </div>
        <small class="text-muted">Total amount paid</small>
      </div>
    </div>
  </div>

  <div class="col-sm-6 col-md-4">
    <div class="card overflow-hidden">
      <div class="bg-holder bg-card"></div>
      <div class="card-body position-relative">
        <h6>Claims Value (Quarter)</h6>
        <div class="display-4 fs-4 fw-normal text-primary">
          {{ number_format($valueQuarter, 2) }}
        </div>
        <small class="text-muted">Total amount paid</small>
      </div>
    </div>
  </div>

  <div class="col-sm-6 col-md-4">
    <div class="card overflow-hidden">
      <div class="bg-holder bg-card"></div>
      <div class="card-body position-relative">
        <h6>Claims Value (Year)</h6>
        <div class="display-4 fs-4 fw-normal text-warning">
          {{ number_format($valueYear, 2) }}
        </div>
        <small class="text-muted">Total amount paid</small>
      </div>
    </div>
  </div>

  {{-- ================= CLAIM STATUS BREAKDOWN ================= --}}
  <div class="col-lg-12">
    <div class="card overflow-hidden">
      <div class="card-header">
        <h6 class="mb-0">Claims Status Breakdown</h6>
      </div>
      <div class="card-body p-0">
        <div class="table-responsive scrollbar">
          <table class="table mb-0 fs--1 table-borderless">
            <thead class="bg-light">
              <tr class="text-800 bg-200">
                <th>Status</th>
                <th class="text-end">Total Claims</th>
              </tr>
            </thead>
            <tbody>
              @forelse($statusBreakdown as $status => $total)
              <tr class="border-bottom border-200">
                <td>
                  <span class="badge
                    @if($status == 'Approved') badge-soft-success
                    @elseif($status == 'Rejected') badge-soft-danger
                    @elseif($status == 'Pending') badge-soft-warning
                    @elseif($status == 'Reviewed') badge-soft-info
                    @else badge-soft-secondary
                    @endif">
                    {{ $status }}
                  </span>
                </td>
                <td class="text-end">{{ $total }}</td>
              </tr>
              @empty
              <tr>
                <td colspan="2" class="text-center text-muted py-3">
                  No claims data available
                </td>
              </tr>
              @endforelse
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>

</div>
@endsection
