<?php
require_once '../admin/includes/branding.php';
require_once '../admin/includes/config.php';

if (!isset($_SESSION['logged_in']) || !$_SESSION['logged_in']) {
    header('Location: user_authentication.html');
    exit;
}

$user_id = $_SESSION['user_id'];
$pdo = getDBConnection();

// Fetch bookings
$stmt = $pdo->prepare("
    SELECT b.*, v.make, v.model, v.images, v.plate_number,
           p.status as payment_status, p.amount as payment_amount,
           r.id as review_id,
           ds.service_name as delivery_service_name
    FROM bookings b
    LEFT JOIN vehicles v ON b.vehicle_id = v.id
    LEFT JOIN payments p ON b.id = p.booking_id
    LEFT JOIN reviews r ON b.id = r.booking_id
    LEFT JOIN delivery_services ds ON b.delivery_service_id = ds.id
    WHERE b.user_id = ?
    ORDER BY b.created_at DESC
");
$stmt->execute([$user_id]);
$bookings = $stmt->fetchAll();

foreach ($bookings as &$booking) {
    if ($booking['booking_type'] === 'delivery') {
        $booking['vehicle_image'] = null; // We'll show an icon
        $booking['vehicle_name'] = $booking['delivery_service_name'] ?: 'Delivery Service';
    } else {
        $images = json_decode($booking['images'] ?? '[]', true);
        $booking['vehicle_image'] = !empty($images) ? $images[0] : 'https://images.unsplash.com/photo-1533473359331-0135ef1b58bf?auto=format&fit=crop&q=80&w=400';
        $booking['vehicle_name'] = $booking['make'] . ' ' . $booking['model'];
    }
}
?>
<!DOCTYPE html>
<html class="dark" lang="en">
<head>
    <meta charset="utf-8"/>
    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
    <title>My Bookings - <?= htmlspecialchars(getBrandName()) ?></title>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet"/>
    <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
    <?php
    $base_path = "../admin/";
    include '../admin/includes/tailwind_config_include.php';
    ?>
    <link rel="stylesheet" href="../admin/includes/responsive.css">
    <style>
        body { -webkit-tap-highlight-color: transparent; }
    </style>
</head>
<body class="bg-background-light dark:bg-background-dark text-gray-900 dark:text-white min-h-screen">
    <header class="sticky top-0 z-50 bg-background-light/80 dark:bg-background-dark/80 backdrop-blur-md border-b border-gray-200 dark:border-gray-800">
        <div class="flex items-center justify-between responsive-container p-clamp-3">
            <a href="index.php" class="flex items-center justify-center shrink-0">
                <span class="material-symbols-outlined" style="font-size: var(--icon-size-base);">arrow_back</span>
            </a>
            <h1 class="text-clamp-lg font-bold flex-1 text-center">My Bookings</h1>
            <div class="flex items-center justify-end" style="width: var(--icon-size-base);"></div>
        </div>
    </header>

    <main class="responsive-container p-4 pb-24">
        <?php if (empty($bookings)): ?>
            <div class="text-center py-20">
                <span class="material-symbols-outlined text-6xl text-gray-400 mb-4">event_busy</span>
                <p class="text-gray-500 dark:text-gray-400 text-lg font-medium">No bookings found</p>
                <a href="browse_cars.php" class="inline-block mt-6 px-6 py-3 bg-primary text-white rounded-lg font-semibold">Browse Cars</a>
            </div>
        <?php else: ?>
            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 3xl:grid-cols-4 5xl:grid-cols-6 7xl:grid-cols-8 8xl:grid-cols-10 gap-4">
                <?php foreach ($bookings as $b): 
                    $status_colors = [
                        'pending' => 'bg-orange-100 text-orange-700 dark:bg-orange-900/30 dark:text-orange-300',
                        'confirmed' => 'bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-300',
                        'active' => 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-300',
                        'completed' => 'bg-gray-100 text-gray-700 dark:bg-gray-900/30 dark:text-gray-300',
                        'cancelled' => 'bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-300'
                    ];
                    $s_color = $status_colors[$b['booking_status']] ?? $status_colors['pending'];
                ?>
                    <div class="bg-card-light dark:bg-card-dark rounded-xl overflow-hidden border border-gray-200 dark:border-gray-800 shadow-sm">
                        <div class="p-4">
                            <div class="flex justify-between items-start mb-3">
                                <div>
                                    <p class="text-[10px] text-gray-500 uppercase font-bold">Reference</p>
                                    <p class="font-bold text-primary"><?= htmlspecialchars($b['reference_number']) ?></p>
                                </div>
                                <span class="px-3 py-1 rounded-full text-[10px] font-bold uppercase <?= $s_color ?>">
                                    <?= htmlspecialchars($b['booking_status']) ?>
                                </span>
                            </div>
                            
                            <div class="flex gap-4 mb-4">
                                <?php if ($b['booking_type'] === 'delivery'): ?>
                                    <div class="w-20 h-20 bg-amber-500 rounded-lg flex items-center justify-center text-white shrink-0">
                                        <span class="material-symbols-outlined text-4xl">local_shipping</span>
                                    </div>
                                <?php else: ?>
                                    <div class="w-20 h-20 bg-gray-200 rounded-lg bg-cover bg-center shrink-0" style="background-image: url('<?= htmlspecialchars($b['vehicle_image']) ?>')"></div>
                                <?php endif; ?>
                                <div class="flex-1 min-w-0">
                                    <h3 class="font-bold truncate"><?= htmlspecialchars($b['vehicle_name']) ?></h3>
                                    <p class="text-xs text-gray-500"><?= $b['booking_type'] === 'delivery' ? 'Delivery' : htmlspecialchars($b['plate_number']) ?></p>
                                    <p class="text-[10px] text-gray-400 mt-1">
                                        <?= date('M d', strtotime($b['pickup_date'])) ?> <?= $b['booking_type'] === 'delivery' ? '' : '- ' . date('M d, Y', strtotime($b['dropoff_date'])) ?>
                                    </p>
                                </div>
                            </div>
                            
                            <div class="flex gap-2">
                                <a href="booking_details.php?booking_id=<?= $b['id'] ?>" class="flex-1 text-center py-2 bg-gray-100 dark:bg-gray-800 rounded-lg text-xs font-bold transition-colors">Details</a>
                                <?php if ($b['booking_status'] === 'pending' && !$b['payment_status']): ?>
                                    <a href="payment_proof_upload.php?booking_id=<?= $b['id'] ?>" class="flex-1 text-center py-2 bg-primary text-white rounded-lg text-xs font-bold">Pay Now</a>
                                <?php endif; ?>
                                <?php if ($b['booking_status'] === 'completed' && !$b['review_id']): ?>
                                    <a href="submit_rating_review.html?booking_id=<?= $b['id'] ?>" class="flex-1 text-center py-2 bg-amber-500 text-white rounded-lg text-xs font-bold">Rate Now</a>
                                <?php endif; ?>
                            </div>
                        </div>
                    </div>
                <?php endforeach; ?>
            </div>
        <?php endif; ?>
    </main>

    <?php include 'includes/bottom_nav.php'; ?>
    <?php include '../admin/includes/floating_chat_include.php'; ?>
</body>
</html>
