@extends('layouts.app')

@section('content')
<div class="max-w-6xl mx-auto py-1 px-6">

    <!-- 🔹 Page Header (Kept your original header with status counts) -->
    <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between mb-6">
        <!-- MODIFIED: Matched title style from reference -->
        <h1 class="text-3xl font-bold text-gray-900">My Dewan Bookings</h1>

        @if(!$bookings->isEmpty())
            <div class="mt-3 sm:mt-0 flex flex-wrap gap-2 text-sm">
                <span class="bg-yellow-100 text-yellow-800 px-3 py-1 rounded-full">Pending: {{ $bookings->where('status', 'pending')->count() }}</span>
                <span class="bg-blue-100 text-blue-800 px-3 py-1 rounded-full">Need Payment: {{ $bookings->where('status', 'need_payment')->count() }}</span>
                <span class="bg-green-100 text-green-800 px-3 py-1 rounded-full">Booked: {{ $bookings->where('status', 'booked')->count() }}</span>
                <span class="bg-gray-100 text-gray-800 px-3 py-1 rounded-full">Under Review: {{ $bookings->where('status', 'awaiting_verification')->count() }}</span>
                <span class="bg-red-100 text-red-800 px-3 py-1 rounded-full">Rejected: {{ $bookings->where('status', 'rejected')->count() }}</span>
            </div>
        @endif
    </div>

    <!-- ✅ Success & Error Alerts -->
    @if (session('success'))
        <div class="mb-6 p-4 rounded-lg border border-green-200 bg-green-50 text-green-800 font-medium shadow-sm">
            {{ session('success') }}
        </div>
    @endif

    @if ($errors->any())
        <div class="mb-6 p-4 rounded-lg border border-red-200 bg-red-50 text-red-800 shadow-sm">
            <ul class="list-disc pl-5 space-y-1">
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    <!-- 🔹 No Bookings -->
    @if($bookings->isEmpty())
        <!-- MODIFIED: Used style from reference file -->
        <div class="text-center py-10 text-gray-500">
            <p>You have not made any Dewan bookings yet.</p>
        </div>
    @else

    <!-- 🔹 Booking Table -->
    <!-- MODIFIED: Added rounded-xl and border to match reference -->
    <div class="overflow-x-auto bg-white shadow rounded-xl border border-gray-200">
        <table class="w-full text-sm border-collapse">
            <!-- MODIFIED: Header style from reference -->
            <thead class="bg-indigo-100 text-gray-800 text-left">
                <tr>
                    <!-- MODIFIED: Added border and font-semibold -->
                    <th class="px-4 py-3 border font-semibold">Dewan</th>
                    <th class="px-4 py-3 border font-semibold">Event</th>
                    <th class="px-4 py-3 border font-semibold text-center">Date</th>
                    <th class="px-4 py-3 border font-semibold text-center">Time</th>
                    <th class="px-4 py-3 border font-semibold text-right">Total (RM)</th>
                    <th class="px-4 py-3 border font-semibold text-center">Status</th>
                    <th class="px-4 py-3 border font-semibold text-center">Actions</th>
                </tr>
            </thead>
            <tbody>
                @foreach($bookings as $booking)
                <!-- MODIFIED: Removed divide-y (using borders now) and added transition -->
                <tr class="hover:bg-gray-50 transition">
                    <!-- MODIFIED: Added border -->
                    <td class="px-4 py-3 border font-medium text-gray-800">{{ $booking->dewan->name ?? '—' }}</td>
                    <td class="px-4 py-3 border text-gray-800">{{ $booking->event_name }}</td>
                    <td class="px-4 py-3 border text-center text-gray-800">{{ \Carbon\Carbon::parse($booking->date)->format('d M Y') }}</td>

                    <!-- Time Column -->
                    <td class="px-4 py-3 border text-center text-gray-800">
                        @if($booking->start_time && $booking->end_time)
                            {{ \Carbon\Carbon::parse($booking->start_time)->format('h:i A') }} –
                            {{ \Carbon\Carbon::parse($booking->end_time)->format('h:i A') }}
                        @else
                            <span class="text-gray-500 italic" title="Full day reservation (Kenduri)">Full Day</span>
                        @endif
                    </td>

                    <!-- Total -->
                    <td class="px-4 py-3 border text-right font-semibold text-gray-800">RM{{ number_format($booking->total_amount, 2) }}</td>

                    <!-- Status Badge -->
                    <td class="px-4 py-3 border text-center ">
                        @php
                            $statusStyles = [
                                'pending' => 'bg-yellow-100 text-yellow-800',
                                'need_payment' => 'bg-blue-100 text-blue-800',
                                'awaiting_verification' => 'bg-gray-100 text-gray-800',
                                'booked' => 'bg-green-100 text-green-800',
                                'rejected' => 'bg-red-100 text-red-800',
                                'cancelled' => 'bg-red-100 text-red-800',
                            ];
                        @endphp
                        <span class="px-3 py-1 text-xs rounded-full font-semibold {{ $statusStyles[$booking->status] ?? 'bg-gray-100 text-gray-700' }}">
                            {{ ucfirst(str_replace('_', ' ', $booking->status)) }}
                        </span>
                    </td>

                    <!-- 🔽 MODIFICATION START: Actions 🔽 -->
                    <td class="px-4 py-3 border text-center whitespace-nowrap space-x-2">
                        @php
                            $buttonStyles = [
                                'pay' => 'bg-yellow-100 text-yellow-800 hover:bg-yellow-200',
                                'cancel' => 'bg-red-100 text-red-800 hover:bg-red-200',
                                'view' => 'bg-indigo-100 text-indigo-800 hover:bg-indigo-200',
                                'view_gray' => 'bg-gray-100 text-gray-700 hover:bg-gray-200',
                                'print' => 'bg-gray-100 text-gray-700 hover:bg-gray-200',
                            ];
                            $pillClass = 'inline-block px-3 py-1 rounded-full text-xs font-semibold transition';
                        @endphp

                        @if($booking->status === 'pending')
                            @if($booking->deposit_receipt_path)
                                <a href="{{ asset('storage/' . $booking->deposit_receipt_path) }}" target="_blank"
                                   class="{{ $pillClass }} {{ $buttonStyles['view'] }}">View Deposit</a>
                            @endif
                        @elseif($booking->status === 'need_payment')
                            <a href="{{ route('dewans.payment', $booking->id) }}"
                               class="{{ $pillClass }} {{ $buttonStyles['pay'] }}">
                                Pay Now
                            </a>
                        @elseif($booking->status === 'awaiting_verification')
                            <a href="{{ asset('storage/' . $booking->payment_receipt_path) }}" target="_blank"
                               class="{{ $pillClass }} {{ $buttonStyles['view_gray'] }}">
                                View Receipt
                            </a>
                        @elseif($booking->status === 'booked')
                            <a href="{{ route('reservations.receipt', $booking->id) }}" 
                               target="_blank"
                               class="{{ $pillClass }} {{ $buttonStyles['print'] }}">
                                Print Receipt
                            </a>
                        @elseif($booking->status === 'rejected')
                            <a href="{{ route('dewans.payment.redo', $booking->id) }}"
                               class="{{ $pillClass }} {{ $buttonStyles['pay'] }}">
                                Redo Payment
                            </a>
                        @elseif($booking->status === 'cancelled')
                            <span class="text-sm text-gray-500">Cancelled</span>
                        @endif

                        @php
                            $cancellableStatuses = ['pending', 'need_payment', 'awaiting_verification','booked'];
                        @endphp
                        
                        @if(in_array($booking->status, $cancellableStatuses))
                            <form method="POST" action="{{ route('reservations.destroy', $booking->id) }}" class="inline" onsubmit="return confirm('Are you sure you want to cancel this booking?');">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="{{ $pillClass }} {{ $buttonStyles['cancel'] }}">
                                    Cancel
                                </button>
                            </form>
                        @endif
                    </td>
                    <!-- 🔼 MODIFICATION END 🔼 -->
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    @endif
</div>
@endsection