@extends('layouts.app')
@section('title', 'Library Reports')
@section('content')
<div class="card">
    <h2 style="font-size:17px;color:#0b4f2c;margin-bottom:16px;">Library Report</h2>
    <div style="display:grid;grid-template-columns:repeat(4,1fr);gap:14px;">
        <div class="card" style="margin:0;"><div style="font-size:11px;color:#777;">Total Books</div><div style="font-size:20px;font-weight:bold;color:#0b4f2c;">{{ $total_books }}</div></div>
        <div class="card" style="margin:0;"><div style="font-size:11px;color:#777;">On Loan</div><div style="font-size:20px;font-weight:bold;">{{ $on_loan }}</div></div>
        <div class="card" style="margin:0;"><div style="font-size:11px;color:#777;">Lost</div><div style="font-size:20px;font-weight:bold;color:#a33;">{{ $lost }}</div></div>
        <div class="card" style="margin:0;"><div style="font-size:11px;color:#777;">Outstanding Fines</div><div style="font-size:20px;font-weight:bold;color:#a67c00;">₦{{ number_format($fines_outstanding, 2) }}</div></div>
    </div>
</div>
@endsection