@extends('layouts.app')

@section('content')
<div class="max-w-7xl mx-auto py-10">

<h1 class="text-3xl font-bold mb-8">Admin Analytics Dashboard</h1>

<div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-10">

    <div class="bg-blue-500 text-white p-6 rounded-xl shadow">
        <p class="text-lg">Total Halls</p>
        <h2 class="text-3xl font-bold">{{ $totalHalls }}</h2>
    </div>

    <div class="bg-yellow-500 text-white p-6 rounded-xl shadow">
        <p class="text-lg">Pending Approvals</p>
        <h2 class="text-3xl font-bold">{{ $pendingHalls }}</h2>
    </div>

    <div class="bg-green-600 text-white p-6 rounded-xl shadow">
        <p class="text-lg">Confirmed Bookings</p>
        <h2 class="text-3xl font-bold">{{ $confirmedBookings }}</h2>
    </div>

    <div class="bg-purple-600 text-white p-6 rounded-xl shadow">
        <p class="text-lg">Total Revenue</p>
        <h2 class="text-3xl font-bold">₹{{ $totalRevenue }}</h2>
    </div>

</div>

<div class="bg-white p-6 rounded-xl shadow">

    <h2 class="text-xl font-bold mb-4">Monthly Booking Summary</h2>

    <table class="w-full text-left">
        <thead>
            <tr class="border-b">
                <th class="py-2">Month</th>
                <th class="py-2">Bookings</th>
            </tr>
        </thead>
        <tbody>
            @foreach($monthlyBookings as $month => $total)
            <tr class="border-b">
                <td class="py-2">{{ $month }}</td>
                <td class="py-2">{{ $total }}</td>
            </tr>
            @endforeach
        </tbody>
    </table>

</div>

</div>
@endsection