@extends('admin.layout.app')

@section('body')
<div class="d-flex flex-column flex-lg-row justify-content-between align-items-start gap-3 mb-4">
    <div>
        <h4 class="fw-bold mb-1">{{ __('admin.fee_reports') }}</h4>
        <p class="text-muted mb-0">Outstanding, collected, paid, unpaid, and partially paid student fee report.</p>
    </div>
    <a href="{{ route('admin.finance-ops.index') }}" class="btn btn-outline-primary rounded-pill">Financial Operations</a>
</div>

<div class="card border-0 shadow-sm rounded-4 mb-4">
    <div class="card-body">
        <form method="GET" class="row g-2 align-items-end">
            <div class="col-md-3">
                <label class="form-label">From</label>
                <input type="date" name="from" value="{{ $from }}" class="form-control">
            </div>
            <div class="col-md-3">
                <label class="form-label">To</label>
                <input type="date" name="to" value="{{ $to }}" class="form-control">
            </div>
            <div class="col-md-3">
                <label class="form-label">Payment status</label>
                <select name="status" class="form-select">
                    <option value="">All students</option>
                    <option value="paid" @selected($status === 'paid')>Paid students</option>
                    <option value="pending" @selected($status === 'pending')>Unpaid students</option>
                    <option value="partial" @selected($status === 'partial')>Partially paid students</option>
                </select>
            </div>
            <div class="col-md-3 d-flex gap-2">
                <button class="btn btn-primary w-100">Filter</button>
                <a href="{{ route('fee.reports') }}" class="btn btn-outline-secondary w-100">Reset</a>
            </div>
        </form>
    </div>
</div>

<div class="row g-3 mb-4">
    <div class="col-md-6 col-xl-3"><div class="card border-0 shadow-sm rounded-4"><div class="card-body"><div class="text-muted small">Total expected</div><div class="fs-3 fw-bold">{{ number_format($totalExpected, 2) }}</div></div></div></div>
    <div class="col-md-6 col-xl-3"><div class="card border-0 shadow-sm rounded-4"><div class="card-body"><div class="text-muted small">Collected</div><div class="fs-3 fw-bold text-success">{{ number_format($totalCollected, 2) }}</div></div></div></div>
    <div class="col-md-6 col-xl-3"><div class="card border-0 shadow-sm rounded-4"><div class="card-body"><div class="text-muted small">Outstanding</div><div class="fs-3 fw-bold text-danger">{{ number_format($outstandingTotal, 2) }}</div></div></div></div>
    <div class="col-md-6 col-xl-3"><div class="card border-0 shadow-sm rounded-4"><div class="card-body"><div class="text-muted small">Students with balance</div><div class="fs-3 fw-bold">{{ $studentsWithOutstanding }}</div></div></div></div>
</div>

<div class="row g-3 mb-4">
    <div class="col-md-4"><div class="p-3 bg-light rounded-4"><div class="text-muted small">Completely paid</div><div class="fs-4 fw-bold text-success">{{ $paidCount }}</div></div></div>
    <div class="col-md-4"><div class="p-3 bg-light rounded-4"><div class="text-muted small">Not paid</div><div class="fs-4 fw-bold text-danger">{{ $unpaidCount }}</div></div></div>
    <div class="col-md-4"><div class="p-3 bg-light rounded-4"><div class="text-muted small">Partially paid</div><div class="fs-4 fw-bold text-warning">{{ $partialCount }}</div></div></div>
</div>

<div class="card border-0 shadow-sm rounded-4">
    <div class="card-header bg-white border-0 fw-bold">Student Fee Statement List</div>
    <div class="card-body table-responsive">
        <table class="table table-hover align-middle">
            <thead class="table-light">
                <tr>
                    <th>Student</th>
                    <th>Program / Class</th>
                    <th>Semester</th>
                    <th class="text-end">Total required</th>
                    <th class="text-end">Paid amount</th>
                    <th class="text-end">Remaining</th>
                    <th>Last payment</th>
                    <th>Status</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
            @forelse($studentFees as $sf)
                @php($lastPayment = $sf->payments->sortByDesc('paid_at')->first())
                <tr>
                    <td>
                        <div class="fw-semibold">{{ $sf->student->name ?? 'N/A' }}</div>
                        <small class="text-muted">{{ $sf->student->email ?? '' }}</small>
                    </td>
                    <td>{{ $sf->student?->studentRecord?->program?->name ?? '—' }}</td>
                    <td>{{ $sf->semester->name ?? 'N/A' }}</td>
                    <td class="text-end">{{ number_format($sf->net_amount, 2) }}</td>
                    <td class="text-end text-success">{{ number_format($sf->paid_amount, 2) }}</td>
                    <td class="text-end text-danger">{{ number_format($sf->outstanding, 2) }}</td>
                    <td>{{ $lastPayment?->paid_at?->format('Y-m-d') ?? '—' }}<br><small>{{ $lastPayment?->shamsi_date }}</small></td>
                    <td><span class="badge text-bg-{{ $sf->status === 'paid' ? 'success' : ($sf->status === 'partial' ? 'warning' : 'danger') }}">{{ ucfirst($sf->status) }}</span></td>
                    <td><a href="{{ route('fee.payments', $sf->id) }}" class="btn btn-sm btn-primary">Payments</a></td>
                </tr>
            @empty
                <tr><td colspan="9" class="text-center text-muted py-4">No fee records found.</td></tr>
            @endforelse
            </tbody>
        </table>
        {{ $studentFees->links('pagination::bootstrap-4') }}
    </div>
</div>
@endsection