sad

README.md

@@ -0,0 +1,66 @@
+# Car Sells in Afghanistan - Modern Web Application
+
+This project is a modern, feature-rich web application for a car dealership in Afghanistan. It provides a platform for users to browse, book, and review cars, along with a comprehensive admin panel for managing the entire platform.
+
+This project was built using PHP, MySQL, and Bootstrap, and features a clean, responsive, and modern design.
+
+## Features
+
+- **Modern & Responsive Design:** A beautiful and intuitive user interface built with Bootstrap and custom modern styling.
+- **Car Listings:** Browse a filterable and searchable list of available cars.
+- **Detailed Car View:** View detailed information and images for each car.
+- **User Authentication:** Secure user registration and login system.
+- **Car Booking System:** Registered users can book cars, which reserves the car until an admin approves the sale.
+- **Review System:** Users can leave ratings and reviews on cars they are interested in.
+- **Comprehensive Admin Dashboard:**
+    - **Analytics:** View stats on total users, cars, sales, and pending bookings. See charts for sales over time and booking distributions.
+    - **User Management:** View, search, and manage user accounts.
+    - **Car Management:** Add, edit, and delete car listings.
+    - **Booking Management:** Approve or cancel car bookings.
+    - **Review Management:** Approve or delete user-submitted reviews.
+- **Afghanistan-Specific Details:** Car listings include relevant details for the Afghan market, such as province and city.
+
+## Getting Started
+
+To get the application up and running on your local system, follow these steps.
+
+### Prerequisites
+
+You will need a LAMP (Linux, Apache, MySQL, PHP) or equivalent stack.
+- Apache
+- PHP 8.0+
+- MySQL or MariaDB
+
+### 1. Set up the Database
+
+1.  **Create a database** in your MySQL/MariaDB server. For example:
+    ```sql
+    CREATE DATABASE car_dealership;
+    ```
+2.  **Configure the connection.** Open `db/config.php` and update the following with your database details:
+    - `DB_HOST`
+    - `DB_NAME`
+    - `DB_USER`
+    - `DB_PASS`
+
+### 2. Run Installation Scripts
+
+Open your web browser and navigate to the following URLs in order. This will set up the necessary tables and seed them with initial data.
+
+1.  `http://<your-domain>/db/setup_users.php`
+2.  `http://<your-domain>/db/setup_cars.php`
+3.  `http://<your-domain>/db/migrate.php`
+
+### 3. Access the Application
+
+Once the setup is complete, you can access the application in your browser:
+
+-   **Main Site:** `http://<your-domain>/`
+-   **Admin Panel:** `http://<your-domain>/admin/`
+
+### 4. Admin Login
+
+-   **Username:** `admin`
+-   **Password:** `123`
+
+It is highly recommended to change the default admin password after your first login.

admin/bookings.php

@@ -12,22 +12,34 @@ $pdo = db();
 
 // Handle booking status change
 if ($_SERVER['REQUEST_METHOD'] === 'POST') {
-    $bookingId = $_POST['booking_id'];
+    $bookingId = filter_input(INPUT_POST, 'booking_id', FILTER_VALIDATE_INT);
-    $carId = $_POST['car_id'];
+    $carId = filter_input(INPUT_POST, 'car_id', FILTER_VALIDATE_INT);
 
+    if ($bookingId && $carId) {
+        $pdo->beginTransaction();
+        try {
             if (isset($_POST['approve'])) {
+                // Set booking to approved and car to sold
                 $pdo->prepare("UPDATE bookings SET status = 'approved' WHERE id = ?")->execute([$bookingId]);
                 $pdo->prepare("UPDATE cars SET status = 'sold' WHERE id = ?")->execute([$carId]);
             } elseif (isset($_POST['cancel'])) {
-        $pdo->prepare("UPDATE bookings SET status = 'canceled' WHERE id = ?")->execute([$bookingId]);
+                // Set booking to cancelled and car back to for sale (approved)
-        $pdo->prepare("UPDATE cars SET status = 'for_sale' WHERE id = ?")->execute([$carId]);
+                $pdo->prepare("UPDATE bookings SET status = 'cancelled' WHERE id = ?")->execute([$bookingId]);
+                $pdo->prepare("UPDATE cars SET status = 'approved' WHERE id = ?")->execute([$carId]);
+            }
+            $pdo->commit();
+        } catch (Exception $e) {
+            $pdo->rollBack();
+            error_log("Booking status update failed: " . $e->getMessage());
+        }
     }
     header("Location: bookings.php");
     exit();
 }
 
+// Fetch bookings with user and car details
 $bookings = $pdo->query("
-    SELECT b.id, b.status, b.booking_date, u.username, c.make, c.model, c.id as car_id
+    SELECT b.id, b.status, b.booking_date, u.username, u.email, c.make, c.model, c.id as car_id
     FROM bookings b
     JOIN users u ON b.user_id = u.id
     JOIN cars c ON b.car_id = c.id
@@ -46,47 +58,55 @@ $projectName = 'Manage Bookings';
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
     <link rel="stylesheet" href="../assets/css/custom.css?v=<?= time() ?>">
 </head>
-<body class="admin-dashboard">
+<body>
-    <?php include __DIR__ . '/../partials/navbar.php'; ?>
+    <div class="admin-wrapper">
+        <?php include 'partials/sidebar.php'; ?>
+        <main class="admin-main-content">
             <div class="container-fluid">
-        <div class="row">
+                <div class="d-flex justify-content-between align-items-center pt-3 pb-2 mb-3 border-bottom">
-            <nav id="sidebar" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
-                <div class="position-sticky pt-3">
-                    <ul class="nav flex-column">
-                        <li class="nav-item"><a class="nav-link" href="index.php"><i class="bi bi-house-door"></i> Dashboard</a></li>
-                        <li class="nav-item"><a class="nav-link" href="users.php"><i class="bi bi-people"></i> Manage Users</a></li>
-                        <li class="nav-item"><a class="nav-link" href="cars.php"><i class="bi bi-car-front"></i> Manage Cars</a></li>
-                        <li class="nav-item"><a class="nav-link active" aria-current="page" href="bookings.php"><i class="bi bi-calendar-check"></i> Manage Bookings</a></li>
-                        <li class="nav-item"><a class="nav-link" href="reviews.php"><i class="bi bi-star-fill"></i> Manage Reviews</a></li>
-                    </ul>
-                </div>
-            </nav>
-            <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
-                <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
                     <h1 class="h2">Manage Bookings</h1>
                 </div>
+
                 <div class="card">
                     <div class="card-body">
                         <div class="table-responsive">
-                            <table class="table table-striped">
+                            <table class="table table-hover align-middle">
-                                <thead class="table-dark">
+                                <thead class="table-light">
-                                    <tr><th>User</th><th>Car</th><th>Date</th><th>Status</th><th>Actions</th></tr>
+                                    <tr>
+                                        <th>Customer</th>
+                                        <th>Car</th>
+                                        <th>Booking Date</th>
+                                        <th>Status</th>
+                                        <th>Actions</th>
+                                    </tr>
                                 </thead>
                                 <tbody>
+                                    <?php if (empty($bookings)): ?>
+                                        <tr><td colspan="5" class="text-center">No bookings found.</td></tr>
+                                    <?php endif; ?>
                                     <?php foreach ($bookings as $booking): ?>
                                     <tr>
-                                        <td><?= htmlspecialchars($booking['username']) ?></td>
+                                        <td>
+                                            <div><b><?= htmlspecialchars($booking['username']) ?></b></div>
+                                            <small class="text-muted"><?= htmlspecialchars($booking['email']) ?></small>
+                                        </td>
                                         <td><?= htmlspecialchars($booking['make'] . ' ' . $booking['model']) ?></td>
-                                        <td><?= date("M d, Y", strtotime($booking['booking_date'])) ?></td>
+                                        <td><?= date("M d, Y, g:i A", strtotime($booking['booking_date'])) ?></td>
-                                        <td><span class="badge bg-info"><?= htmlspecialchars($booking['status']) ?></span></td>
+                                        <td>
+                                            <span class="badge rounded-pill bg-<?= str_replace(['approved', 'pending', 'cancelled'], ['success', 'warning', 'danger'], $booking['status']) ?>">
+                                                <?= htmlspecialchars(ucfirst($booking['status'])) ?>
+                                            </span>
+                                        </td>
                                         <td>
                                             <?php if ($booking['status'] === 'pending'): ?>
-                                            <form method="POST" class="d-inline">
+                                            <form method="POST" class="d-inline-flex gap-2" onsubmit="return confirm('Are you sure?');">
                                                 <input type="hidden" name="booking_id" value="<?= $booking['id'] ?>">
                                                 <input type="hidden" name="car_id" value="<?= $booking['car_id'] ?>">
-                                                <button type="submit" name="approve" class="btn btn-sm btn-success">Approve</button>
+                                                <button type="submit" name="approve" class="btn btn-sm btn-success"><i class="bi bi-check-circle me-1"></i>Approve</button>
-                                                <button type="submit" name="cancel" class="btn btn-sm btn-danger">Cancel</button>
+                                                <button type="submit" name="cancel" class="btn btn-sm btn-danger"><i class="bi bi-x-circle me-1"></i>Cancel</button>
                                             </form>
+                                            <?php else: ?>
+                                                <span class="text-muted">No actions</span>
                                             <?php endif; ?>
                                         </td>
                                     </tr>
@@ -96,8 +116,8 @@ $projectName = 'Manage Bookings';
                         </div>
                     </div>
                 </div>
-            </main>
             </div>
+        </main>
     </div>
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
 </body>

admin/cars.php

@@ -12,28 +12,29 @@ $pdo = db();
 
 // Handle Add/Edit/Delete
 if ($_SERVER['REQUEST_METHOD'] === 'POST') {
-    // Delete
+    $carId = filter_input(INPUT_POST, 'car_id', FILTER_VALIDATE_INT);
+
     if (isset($_POST['delete_car'])) {
-        $carId = $_POST['car_id'];
         $stmt = $pdo->prepare("DELETE FROM cars WHERE id = ?");
         $stmt->execute([$carId]);
         header("Location: cars.php");
         exit();
     }
 
-    // Add/Edit
+    // Sanitize and validate inputs
-    $carId = $_POST['car_id'] ?? null;
+    $make = trim(filter_input(INPUT_POST, 'make', FILTER_SANITIZE_SPECIAL_CHARS));
-    $make = $_POST['make'];
+    $model = trim(filter_input(INPUT_POST, 'model', FILTER_SANITIZE_SPECIAL_CHARS));
-    $model = $_POST['model'];
+    $year = filter_input(INPUT_POST, 'year', FILTER_VALIDATE_INT);
-    $year = $_POST['year'];
+    $price = filter_input(INPUT_POST, 'price', FILTER_VALIDATE_FLOAT);
-    $price = $_POST['price'];
+    $status = in_array($_POST['status'], ['approved', 'pending', 'sold', 'reserved']) ? $_POST['status'] : 'pending';
-    $status = $_POST['status'];
+    $description = trim(filter_input(INPUT_POST, 'description', FILTER_SANITIZE_SPECIAL_CHARS));
-    $description = $_POST['description'];
+    $color = trim(filter_input(INPUT_POST, 'color', FILTER_SANITIZE_SPECIAL_CHARS));
+    $mileage = filter_input(INPUT_POST, 'mileage', FILTER_VALIDATE_INT);
     $imageUrl = $_POST['existing_image']; // Keep existing image by default
 
     if (isset($_FILES['image']) && $_FILES['image']['error'] == 0) {
         $targetDir = "../assets/images/cars/";
-        if (!is_dir($targetDir)) mkdir($targetDir, 0755, true);
+        if (!is_dir($targetDir)) mkdir($targetDir, 0775, true);
         $fileName = uniqid() . '-' . basename($_FILES["image"]["name"]);
         $targetFilePath = $targetDir . $fileName;
         if (move_uploaded_file($_FILES["image"]["tmp_name"], $targetFilePath)) {
@@ -42,32 +43,37 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
     }
 
     if ($carId) { // Update
-        $sql = "UPDATE cars SET make=?, model=?, year=?, price=?, status=?, description=?, image_url=? WHERE id=?";
+        $sql = "UPDATE cars SET make=?, model=?, year=?, price=?, status=?, description=?, image_url=?, color=?, mileage=? WHERE id=?";
         $stmt = $pdo->prepare($sql);
-        $stmt->execute([$make, $model, $year, $price, $status, $description, $imageUrl, $carId]);
+        $stmt->execute([$make, $model, $year, $price, $status, $description, $imageUrl, $color, $mileage, $carId]);
     } else { // Insert
-        $sql = "INSERT INTO cars (make, model, year, price, status, description, image_url) VALUES (?, ?, ?, ?, ?, ?, ?)";
+        $sql = "INSERT INTO cars (make, model, year, price, status, description, image_url, color, mileage) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)";
         $stmt = $pdo->prepare($sql);
-        $stmt->execute([$make, $model, $year, $price, $status, $description, $imageUrl]);
+        $stmt->execute([$make, $model, $year, $price, $status, $description, $imageUrl, $color, $mileage]);
     }
     header("Location: cars.php");
     exit();
 }
 
+// Fetching cars with filters
 $search = $_GET['search'] ?? '';
 $filter_status = $_GET['status'] ?? 'all';
 
 $sql = "SELECT * FROM cars";
 $params = [];
+$where = [];
 if (!empty($search)) {
-    $sql .= " WHERE (make LIKE ? OR model LIKE ?)";
+    $where[] = "(make LIKE ? OR model LIKE ?)";
     $params[] = "%$search%";
     $params[] = "%$search%";
 }
 if ($filter_status !== 'all') {
-    $sql .= (strpos($sql, 'WHERE') === false ? " WHERE" : " AND") . " status = ?";
+    $where[] = "status = ?";
     $params[] = $filter_status;
 }
+if (!empty($where)) {
+    $sql .= " WHERE " . implode(' AND ', $where);
+}
 $sql .= " ORDER BY created_at DESC";
 $stmt = $pdo->prepare($sql);
 $stmt->execute($params);
@@ -80,65 +86,39 @@ $projectName = 'Manage Cars';
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title><?php echo htmlspecialchars($projectName); ?></title>
+    <title><?= htmlspecialchars($projectName) ?></title>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?= time() ?>">
-    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
 </head>
-<body class="admin-dashboard">
+<body>
-    <?php include __DIR__ . '/../partials/navbar.php'; ?>
+    <div class="admin-wrapper">
+        <?php include 'partials/sidebar.php'; ?>
+        <main class="admin-main-content">
             <div class="container-fluid">
-        <div class="row">
+                <div class="d-flex justify-content-between align-items-center pt-3 pb-2 mb-3 border-bottom">
-            <nav id="sidebar" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
-                <div class="position-sticky pt-3">
-                    <ul class="nav flex-column">
-                        <li class="nav-item"><a class="nav-link" href="index.php"><i class="bi bi-house-door"></i> Dashboard</a></li>
-                        <li class="nav-item"><a class="nav-link" href="users.php"><i class="bi bi-people"></i> Manage Users</a></li>
-                        <li class="nav-item"><a class="nav-link active" aria-current="page" href="cars.php"><i class="bi bi-car-front"></i> Manage Cars</a></li>
-                        <li class="nav-item"><a class="nav-link" href="bookings.php"><i class="bi bi-calendar-check"></i> Manage Bookings</a></li>
-                        <li class="nav-item"><a class="nav-link" href="reviews.php"><i class="bi bi-star-fill"></i> Manage Reviews</a></li>
-                    </ul>
-                </div>
-            </nav>
-            <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
-                <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
                     <h1 class="h2">Manage Cars</h1>
-                    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#carModal"><i class="bi bi-plus-circle"></i> Add New Car</button>
+                    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#carModal"><i class="bi bi-plus-circle me-2"></i>Add New Car</button>
                 </div>
 
                 <div class="card">
-                    <div class="card-header">
-                        <form method="GET" action="cars.php" class="row g-3">
-                            <div class="col-md-4"><input type="text" name="search" class="form-control" placeholder="Search by make or model..." value="<?= htmlspecialchars($search) ?>"></div>
-                            <div class="col-md-3">
-                                <select name="status" class="form-select">
-                                    <option value="all">All Statuses</option>
-                                    <option value="for_sale" <?= $filter_status == 'for_sale' ? 'selected' : '' ?>>For Sale</option>
-                                    <option value="reserved" <?= $filter_status == 'reserved' ? 'selected' : '' ?>>Reserved</option>
-                                    <option value="sold" <?= $filter_status == 'sold' ? 'selected' : '' ?>>Sold</option>
-                                </select>
-                            </div>
-                            <div class="col-md-2"><button type="submit" class="btn btn-primary">Filter</button></div>
-                        </form>
-                    </div>
                     <div class="card-body">
                         <div class="table-responsive">
-                            <table class="table table-striped">
+                            <table class="table table-hover align-middle">
-                                <thead class="table-dark">
+                                <thead class="table-light">
-                                    <tr><th>Image</th><th>Make/Model</th><th>Year</th><th>Price</th><th>Status</th><th>Actions</th></tr>
+                                    <tr><th>Image</th><th>Make & Model</th><th>Price</th><th>Status</th><th>Year</th><th>Actions</th></tr>
                                 </thead>
                                 <tbody>
                                     <?php foreach ($cars as $car): ?>
                                     <tr>
-                                        <td><img src="../<?= htmlspecialchars($car['image_url']) ?>" height="50" alt="<?= htmlspecialchars($car['make']) ?>"></td>
+                                        <td><img src="../<?= htmlspecialchars($car['image_url']) ?>" height="50" width="80" style="object-fit: cover;" class="rounded" alt="<?= htmlspecialchars($car['make']) ?>"></td>
-                                        <td><?= htmlspecialchars($car['make'] . ' ' . $car['model']) ?></td>
+                                        <td><b><?= htmlspecialchars($car['make'] . ' ' . $car['model']) ?></b></td>
-                                        <td><?= htmlspecialchars($car['year']) ?></td>
                                         <td>$<?= number_format($car['price']) ?></td>
-                                        <td><span class="badge bg-info"><?= htmlspecialchars($car['status']) ?></span></td>
+                                        <td><span class="badge bg-<?= str_replace(['approved', 'pending','reserved', 'sold'], ['success', 'warning','info', 'danger'], $car['status']) ?>"><?= htmlspecialchars(ucfirst($car['status'])) ?></span></td>
+                                        <td><?= htmlspecialchars($car['year']) ?></td>
                                         <td>
-                                            <button type="button" class="btn btn-sm btn-outline-primary edit-btn" data-bs-toggle="modal" data-bs-target="#carModal" data-car='<?= json_encode($car) ?>'><i class="bi bi-pencil-square"></i></button>
+                                            <button type="button" class="btn btn-sm btn-outline-primary edit-btn" data-bs-toggle="modal" data-bs-target="#carModal" data-car='<?= htmlspecialchars(json_encode($car), ENT_QUOTES, 'UTF-8') ?>'><i class="bi bi-pencil-square"></i></button>
-                                            <form method="POST" class="d-inline" onsubmit="return confirm('Delete this car?');">
+                                            <form method="POST" class="d-inline" onsubmit="return confirm('Are you sure you want to delete this car?');">
                                                 <input type="hidden" name="car_id" value="<?= $car['id'] ?>">
                                                 <button type="submit" name="delete_car" class="btn btn-sm btn-outline-danger"><i class="bi bi-trash"></i></button>
                                             </form>
@@ -150,8 +130,8 @@ $projectName = 'Manage Cars';
                         </div>
                     </div>
                 </div>
-            </main>
             </div>
+        </main>
     </div>
 
     <!-- Car Modal -->
@@ -166,25 +146,29 @@ $projectName = 'Manage Cars';
                         <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                     </div>
                     <div class="modal-body">
-                        <div class="row">
+                        <div class="row g-3">
-                            <div class="col-md-6 mb-3"><label>Make</label><input type="text" name="make" id="make" class="form-control" required></div>
+                            <div class="col-md-6"><label class="form-label">Make</label><input type="text" name="make" id="make" class="form-control" required></div>
-                            <div class="col-md-6 mb-3"><label>Model</label><input type="text" name="model" id="model" class="form-control" required></div>
+                            <div class="col-md-6"><label class="form-label">Model</label><input type="text" name="model" id="model" class="form-control" required></div>
-                        </div>
+                            <div class="col-md-6"><label class="form-label">Year</label><input type="number" name="year" id="year" class="form-control" required></div>
-                         <div class="row">
+                            <div class="col-md-6"><label class="form-label">Price</label><input type="number" name="price" id="price" class="form-control" step="100" required></div>
-                            <div class="col-md-6 mb-3"><label>Year</label><input type="number" name="year" id="year" class="form-control" required></div>
+                            <div class="col-md-6"><label class="form-label">Mileage (km)</label><input type="number" name="mileage" id="mileage" class="form-control"></div>
-                            <div class="col-md-6 mb-3"><label>Price</label><input type="number" name="price" id="price" class="form-control" step="0.01" required></div>
+                            <div class="col-md-6"><label class="form-label">Color</label><input type="text" name="color" id="color" class="form-control"></div>
-                        </div>
+                            <div class="col-md-6">
-                        <div class="mb-3">
+                                <label class="form-label">Status</label>
-                            <label>Status</label>
                                 <select name="status" id="status" class="form-select">
-                                <option value="for_sale">For Sale</option>
+                                    <option value="pending">Pending</option>
+                                    <option value="approved">Approved</option>
                                     <option value="reserved">Reserved</option>
                                     <option value="sold">Sold</option>
                                 </select>
                             </div>
-                        <div class="mb-3"><label>Description</label><textarea name="description" id="description" class="form-control" rows="3"></textarea></div>
+                            <div class="col-12"><label class="form-label">Description</label><textarea name="description" id="description" class="form-control" rows="3"></textarea></div>
-                        <div class="mb-3"><label>Image</label><input type="file" name="image" class="form-control"></div>
+                            <div class="col-12">
-                        <img id="image_preview" src="" class="img-fluid rounded" style="max-height: 150px;">
+                                <label class="form-label">Image</label>
+                                <input type="file" name="image" class="form-control">
+                                <img id="image_preview" src="" class="img-fluid rounded mt-2" style="max-height: 150px; display: none;">
+                            </div>
+                        </div>
                     </div>
                     <div class="modal-footer">
                         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
@@ -196,5 +180,43 @@ $projectName = 'Manage Cars';
     </div>
 
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+<script>
+document.addEventListener('DOMContentLoaded', function () {
+    const carModal = document.getElementById('carModal');
+    carModal.addEventListener('show.bs.modal', function (event) {
+        const button = event.relatedTarget;
+        const modalTitle = carModal.querySelector('.modal-title');
+        const form = carModal.querySelector('form');
+        const imagePreview = document.getElementById('image_preview');
+
+        form.reset();
+        imagePreview.style.display = 'none';
+        imagePreview.src = '';
+        
+        const carData = button.dataset.car ? JSON.parse(button.dataset.car) : null;
+
+        if (carData) {
+            modalTitle.textContent = 'Edit Car: ' + carData.make + ' ' + carData.model;
+            form.querySelector('#car_id').value = carData.id;
+            form.querySelector('#make').value = carData.make;
+            form.querySelector('#model').value = carData.model;
+            form.querySelector('#year').value = carData.year;
+            form.querySelector('#price').value = carData.price;
+            form.querySelector('#status').value = carData.status;
+            form.querySelector('#description').value = carData.description;
+            form.querySelector('#mileage').value = carData.mileage;
+            form.querySelector('#color').value = carData.color;
+            form.querySelector('#existing_image').value = carData.image_url;
+            if (carData.image_url) {
+                imagePreview.src = '../' + carData.image_url;
+                imagePreview.style.display = 'block';
+            }
+        } else {
+            modalTitle.textContent = 'Add New Car';
+            form.querySelector('#car_id').value = '';
+        }
+    });
+});
+</script>
 </body>
 </html>

admin/index.php

@@ -14,34 +14,27 @@ $pdo = db();
 $stats = [
     'users' => $pdo->query("SELECT COUNT(*) FROM users")->fetchColumn(),
     'cars' => $pdo->query("SELECT COUNT(*) FROM cars")->fetchColumn(),
-    'bookings' => $pdo->query("SELECT COUNT(*) FROM bookings")->fetchColumn(),
+    'bookings' => $pdo->query("SELECT COUNT(*) FROM bookings WHERE status = 'approved'")->fetchColumn(),
-    'reviews' => $pdo->query("SELECT COUNT(*) FROM reviews")->fetchColumn(),
+    'pending_bookings' => $pdo->query("SELECT COUNT(*) FROM bookings WHERE status = 'pending'")->fetchColumn(),
 ];
 
-// Chart Data
+// Chart Data: Sales over the last 30 days
-$sales_data = $pdo->query("SELECT DATE(booking_date) as date, COUNT(*) as count FROM bookings WHERE status = 'approved' GROUP BY DATE(booking_date) ORDER BY date ASC")->fetchAll(PDO::FETCH_ASSOC);
+$sales_data = $pdo->query("SELECT DATE(booking_date) as date, COUNT(*) as count FROM bookings WHERE status = 'approved' AND booking_date >= DATE_SUB(CURDATE(), INTERVAL 30 DAY) GROUP BY DATE(booking_date) ORDER BY date ASC")->fetchAll(PDO::FETCH_ASSOC);
+
+// Chart Data: Bookings status distribution
 $bookings_status_data = $pdo->query("SELECT status, COUNT(*) as count FROM bookings GROUP BY status")->fetchAll(PDO::FETCH_ASSOC);
 
-// Top Cars
+// Top Selling Cars (based on approved bookings)
 $top_selling_cars = $pdo->query("
     SELECT c.make, c.model, COUNT(b.id) as sales
     FROM cars c
     JOIN bookings b ON c.id = b.car_id
     WHERE b.status = 'approved'
-    GROUP BY c.id
+    GROUP BY c.id, c.make, c.model
     ORDER BY sales DESC
     LIMIT 5
 ")->fetchAll(PDO::FETCH_ASSOC);
 
-$most_popular_cars = $pdo->query("
-    SELECT c.make, c.model, COUNT(r.id) as review_count
-    FROM cars c
-    LEFT JOIN reviews r ON c.id = r.car_id
-    GROUP BY c.id
-    ORDER BY review_count DESC
-    LIMIT 5
-")->fetchAll(PDO::FETCH_ASSOC);
-
 $projectName = 'Admin Dashboard';
 ?>
 <!DOCTYPE html>
@@ -55,63 +48,87 @@ $projectName = 'Admin Dashboard';
     <link rel="stylesheet" href="../assets/css/custom.css?v=<?= time() ?>">
     <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
 </head>
-<body class="admin-dashboard">
+<body>
-    <?php include __DIR__ . '/../partials/navbar.php'; ?>
+    <div class="admin-wrapper">
+        <?php include 'partials/sidebar.php'; ?>
+        <main class="admin-main-content">
             <div class="container-fluid">
-        <div class="row">
+                <div class="d-flex justify-content-between align-items-center pt-3 pb-2 mb-3 border-bottom">
-            <nav id="sidebar" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
+                    <h1 class="h2">Dashboard</h1>
-                <div class="position-sticky pt-3">
+                    <span class="text-muted">Welcome, <?= htmlspecialchars($_SESSION['username']) ?>!</span>
-                     <ul class="nav flex-column">
-                        <li class="nav-item"><a class="nav-link active" aria-current="page" href="index.php"><i class="bi bi-house-door"></i> Dashboard</a></li>
-                        <li class="nav-item"><a class="nav-link" href="users.php"><i class="bi bi-people"></i> Manage Users</a></li>
-                        <li class="nav-item"><a class="nav-link" href="cars.php"><i class="bi bi-car-front"></i> Manage Cars</a></li>
-                        <li class="nav-item"><a class="nav-link" href="bookings.php"><i class="bi bi-calendar-check"></i> Manage Bookings</a></li>
-                        <li class="nav-item"><a class="nav-link" href="reviews.php"><i class="bi bi-star-fill"></i> Manage Reviews</a></li>
-                    </ul>
                 </div>
-            </nav>
+
-            <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
-                <h1 class="h2 pt-3 pb-2 mb-3 border-bottom">Dashboard</h1>
-                <div class="row g-4">
                 <!-- Stat Cards -->
-                    <div class="col-6 col-lg-3"><div class="card bg-primary text-white"><div class="card-body"><h5>Users</h5><p class="fs-2"><?= $stats['users'] ?></p></div></div></div>
+                <div class="row g-4 mb-4">
-                    <div class="col-6 col-lg-3"><div class="card bg-success text-white"><div class="card-body"><h5>Cars</h5><p class="fs-2"><?= $stats['cars'] ?></p></div></div></div>
+                    <div class="col-md-6 col-lg-3"><div class="stat-card"><h4>Total Users</h4><p class="fs-2 fw-bold"><?= $stats['users'] ?></p></div></div>
-                    <div class="col-6 col-lg-3"><div class="card bg-info text-white"><div class="card-body"><h5>Bookings</h5><p class="fs-2"><?= $stats['bookings'] ?></p></div></div></div>
+                    <div class="col-md-6 col-lg-3"><div class="stat-card"><h4>Listed Cars</h4><p class="fs-2 fw-bold"><?= $stats['cars'] ?></p></div></div>
-                    <div class="col-6 col-lg-3"><div class="card bg-warning text-white"><div class="card-body"><h5>Reviews</h5><p class="fs-2"><?= $stats['reviews'] ?></p></div></div></div>
+                    <div class="col-md-6 col-lg-3"><div class="stat-card"><h4>Completed Sales</h4><p class="fs-2 fw-bold"><?= $stats['bookings'] ?></p></div></div>
+                    <div class="col-md-6 col-lg-3"><div class="stat-card"><h4>Pending Bookings</h4><p class="fs-2 fw-bold"><?= $stats['pending_bookings'] ?></p></div></div>
+                </div>
 
                 <!-- Charts -->
-                    <div class="col-md-8"><div class="card"><div class="card-header">Sales Over Time</div><div class="card-body"><canvas id="salesChart"></canvas></div></div></div>
+                <div class="row g-4 mb-4">
-                    <div class="col-md-4"><div class="card"><div class="card-header">Bookings Status</div><div class="card-body"><canvas id="bookingsChart"></canvas></div></div></div>
+                    <div class="col-lg-8">
+                        <div class="card h-100"><div class="card-body"><h5 class="card-title">Sales Over Time (Last 30 Days)</h5><canvas id="salesChart"></canvas></div></div>
+                    </div>
+                    <div class="col-lg-4">
+                        <div class="card h-100"><div class="card-body"><h5 class="card-title">Bookings Distribution</h5><canvas id="bookingsChart"></canvas></div></div>
+                    </div>
+                </div>
 
                 <!-- Top Lists -->
-                    <div class="col-md-6"><div class="card"><div class="card-header">Top Selling Cars</div><div class="card-body"><ul class="list-group list-group-flush"><?php foreach($top_selling_cars as $c) echo "<li class='list-group-item'>{$c['make']} {$c['model']} <span class='badge bg-success float-end'>{$c['sales']} sales</span></li>"; ?></ul></div></div></div>
+                <div class="card">
-                    <div class="col-md-6"><div class="card"><div class="card-header">Most Popular Cars (by Reviews)</div><div class="card-body"><ul class="list-group list-group-flush"><?php foreach($most_popular_cars as $c) echo "<li class='list-group-item'>{$c['make']} {$c['model']} <span class='badge bg-warning float-end'>{$c['review_count']} reviews</span></li>"; ?></ul></div></div></div>
+                    <div class="card-header"><h5 class="card-title mb-0">Top 5 Selling Cars</h5></div>
+                    <div class="card-body">
+                        <div class="list-group list-group-flush">
+                            <?php if (empty($top_selling_cars)): ?>
+                                <div class="list-group-item">No sales data available yet.</div>
+                            <?php else: ?>
+                                <?php foreach($top_selling_cars as $c): ?>
+                                <div class="list-group-item d-flex justify-content-between align-items-center">
+                                    <?= htmlspecialchars($c['make'] . ' ' . $c['model']) ?>
+                                    <span class="badge bg-success rounded-pill"><?= $c['sales'] ?> sales</span>
+                                </div>
+                                <?php endforeach; ?>
+                            <?php endif; ?>
+                        </div>
+                    </div>
+                </div>
             </div>
         </main>
     </div>
-    </div>
+
 <script>
-    const salesChart = new Chart(document.getElementById('salesChart'), {
+    // Chart.js configurations
+    const salesChartCtx = document.getElementById('salesChart').getContext('2d');
+    new Chart(salesChartCtx, {
         type: 'line',
         data: {
             labels: <?= json_encode(array_column($sales_data, 'date')) ?>,
             datasets: [{
-                label: 'Sales',
+                label: 'Daily Sales',
                 data: <?= json_encode(array_column($sales_data, 'count')) ?>,
-                borderColor: 'rgba(75, 192, 192, 1)',
+                borderColor: 'var(--primary-color)',
-                tension: 0.1
+                backgroundColor: 'rgba(79, 70, 229, 0.1)',
+                fill: true,
+                tension: 0.4
             }]
         }
     });
 
-    const bookingsChart = new Chart(document.getElementById('bookingsChart'), {
+    const bookingsChartCtx = document.getElementById('bookingsChart').getContext('2d');
+    new Chart(bookingsChartCtx, {
         type: 'doughnut',
         data: {
             labels: <?= json_encode(array_column($bookings_status_data, 'status')) ?>,
             datasets: [{
                 data: <?= json_encode(array_column($bookings_status_data, 'count')) ?>,
-                backgroundColor: ['#0d6efd', '#198754', '#dc3545']
+                backgroundColor: ['#ffc107', '#198754', '#dc3545'] // Pending, Approved, Cancelled
             }]
+        },
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
         }
     });
 </script>

admin/partials/sidebar.php

@@ -0,0 +1,37 @@
+<?php
+// This is a new file: admin/partials/sidebar.php
+$current_page = basename($_SERVER['PHP_SELF']);
+?>
+<nav class="admin-sidebar">
+    <a class="navbar-brand mb-4" href="index.php">CarAdmin</a>
+    <ul class="nav flex-column">
+        <li class="nav-item">
+            <a class="nav-link <?php echo ($current_page == 'index.php') ? 'active' : ''; ?>" href="index.php">
+                <i class="bi bi-grid-1x2-fill me-2"></i> Dashboard
+            </a>
+        </li>
+        <li class="nav-item">
+            <a class="nav-link <?php echo ($current_page == 'cars.php') ? 'active' : ''; ?>" href="cars.php">
+                <i class="bi bi-car-front-fill me-2"></i> Manage Cars
+            </a>
+        </li>
+        <li class="nav-item">
+            <a class="nav-link <?php echo ($current_page == 'bookings.php') ? 'active' : ''; ?>" href="bookings.php">
+                <i class="bi bi-calendar-check-fill me-2"></i> Manage Bookings
+            </a>
+        </li>
+        <li class="nav-item">
+            <a class="nav-link <?php echo ($current_page == 'users.php') ? 'active' : ''; ?>" href="users.php">
+                <i class="bi bi-people-fill me-2"></i> Manage Users
+            </a>
+        </li>
+        <li class="nav-item">
+            <a class="nav-link <?php echo ($current_page == 'reviews.php') ? 'active' : ''; ?>" href="reviews.php">
+                <i class="bi bi-star-half me-2"></i> Manage Reviews
+            </a>
+        </li>
+    </ul>
+    <div class="mt-auto">
+         <a class="nav-link" href="../logout.php"><i class="bi bi-box-arrow-left me-2"></i> Logout</a>
+    </div>
+</nav>

admin/reviews.php

@@ -10,19 +10,24 @@ require_once '../db/config.php';
 
 $pdo = db();
 
-// Handle review status change
+// Handle review status change or deletion
 if ($_SERVER['REQUEST_METHOD'] === 'POST') {
-    $reviewId = $_POST['review_id'];
+    $reviewId = filter_input(INPUT_POST, 'review_id', FILTER_VALIDATE_INT);
 
+    if ($reviewId) {
         if (isset($_POST['approve'])) {
             $pdo->prepare("UPDATE reviews SET status = 'approved' WHERE id = ?")->execute([$reviewId]);
+        } elseif (isset($_POST['unapprove'])) {
+            $pdo->prepare("UPDATE reviews SET status = 'pending' WHERE id = ?")->execute([$reviewId]);
         } elseif (isset($_POST['delete'])) {
             $pdo->prepare("DELETE FROM reviews WHERE id = ?")->execute([$reviewId]);
         }
+    }
     header("Location: reviews.php");
     exit();
 }
 
+// Fetch reviews with user and car details
 $reviews = $pdo->query("
     SELECT r.id, r.rating, r.review, r.status, r.created_at, u.username, c.make, c.model
     FROM reviews r
@@ -32,6 +37,15 @@ $reviews = $pdo->query("
 ")->fetchAll(PDO::FETCH_ASSOC);
 
 $projectName = 'Manage Reviews';
+
+function render_stars($rating) {
+    $rating = (int)$rating;
+    $html = '';
+    for ($i = 1; $i <= 5; $i++) {
+        $html .= $i <= $rating ? '★' : '☆';
+    }
+    return '<span class="text-warning">' . $html . '</span>';
+}
 ?>
 <!DOCTYPE html>
 <html lang="en">
@@ -43,48 +57,48 @@ $projectName = 'Manage Reviews';
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
     <link rel="stylesheet" href="../assets/css/custom.css?v=<?= time() ?>">
 </head>
-<body class="admin-dashboard">
+<body>
-    <?php include __DIR__ . '/../partials/navbar.php'; ?>
+    <div class="admin-wrapper">
+        <?php include 'partials/sidebar.php'; ?>
+        <main class="admin-main-content">
             <div class="container-fluid">
-        <div class="row">
+                <div class="d-flex justify-content-between align-items-center pt-3 pb-2 mb-3 border-bottom">
-            <nav id="sidebar" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
-                <div class="position-sticky pt-3">
-                    <ul class="nav flex-column">
-                        <li class="nav-item"><a class="nav-link" href="index.php"><i class="bi bi-house-door"></i> Dashboard</a></li>
-                        <li class="nav-item"><a class="nav-link" href="users.php"><i class="bi bi-people"></i> Manage Users</a></li>
-                        <li class="nav-item"><a class="nav-link" href="cars.php"><i class="bi bi-car-front"></i> Manage Cars</a></li>
-                        <li class="nav-item"><a class="nav-link" href="bookings.php"><i class="bi bi-calendar-check"></i> Manage Bookings</a></li>
-                        <li class="nav-item"><a class="nav-link active" aria-current="page" href="reviews.php"><i class="bi bi-star-fill"></i> Manage Reviews</a></li>
-                    </ul>
-                </div>
-            </nav>
-            <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
-                <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
                     <h1 class="h2">Manage Reviews</h1>
                 </div>
+
                 <div class="card">
                     <div class="card-body">
                         <div class="table-responsive">
-                            <table class="table table-striped">
+                            <table class="table table-hover align-middle">
-                                <thead class="table-dark">
+                                <thead class="table-light">
-                                    <tr><th>User</th><th>Car</th><th>Rating</th><th>Review</th><th>Date</th><th>Status</th><th>Actions</th></tr>
+                                    <tr><th>Reviewer</th><th>Car</th><th>Review</th><th>Status</th><th>Actions</th></tr>
                                 </thead>
                                 <tbody>
+                                    <?php if (empty($reviews)): ?>
+                                        <tr><td colspan="5" class="text-center">No reviews found.</td></tr>
+                                    <?php endif; ?>
                                     <?php foreach ($reviews as $review): ?>
                                     <tr>
-                                        <td><?= htmlspecialchars($review['username']) ?></td>
+                                        <td><b><?= htmlspecialchars($review['username']) ?></b></td>
                                         <td><?= htmlspecialchars($review['make'] . ' ' . $review['model']) ?></td>
-                                        <td><?= str_repeat('&#9733;', $review['rating']) ?></td>
-                                        <td><?= htmlspecialchars($review['review']) ?></td>
-                                        <td><?= date("M d, Y", strtotime($review['created_at'])) ?></td>
-                                        <td><span class="badge bg-info"><?= htmlspecialchars($review['status']) ?></span></td>
                                         <td>
-                                            <form method="POST" class="d-inline">
+                                            <div><?= render_stars($review['rating']) ?></div>
+                                            <small class="text-muted">"<?= nl2br(htmlspecialchars($review['review'])) ?>"</small>
+                                        </td>
+                                        <td>
+                                            <span class="badge rounded-pill bg-<?= $review['status'] === 'approved' ? 'success' : 'warning' ?>">
+                                                <?= htmlspecialchars(ucfirst($review['status'])) ?>
+                                            </span>
+                                        </td>
+                                        <td>
+                                            <form method="POST" class="d-inline-flex gap-2">
                                                 <input type="hidden" name="review_id" value="<?= $review['id'] ?>">
                                                 <?php if ($review['status'] === 'pending'): ?>
-                                                <button type="submit" name="approve" class="btn btn-sm btn-success">Approve</button>
+                                                    <button type="submit" name="approve" class="btn btn-sm btn-success" title="Approve"><i class="bi bi-check-lg"></i></button>
+                                                <?php else: ?>
+                                                    <button type="submit" name="unapprove" class="btn btn-sm btn-secondary" title="Set as Pending"><i class="bi bi-clock-history"></i></button>
                                                 <?php endif; ?>
-                                                <button type="submit" name="delete" class="btn btn-sm btn-danger">Delete</button>
+                                                <button type="submit" name="delete" class="btn btn-sm btn-danger" onclick="return confirm('Are you sure you want to delete this review?');" title="Delete"><i class="bi bi-trash"></i></button>
                                             </form>
                                         </td>
                                     </tr>
@@ -94,8 +108,8 @@ $projectName = 'Manage Reviews';
                         </div>
                     </div>
                 </div>
-            </main>
             </div>
+        </main>
     </div>
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
 </body>

admin/users.php

@@ -8,49 +8,49 @@ if (!isset($_SESSION['user_id']) || $_SESSION['role'] !== 'admin') {
 
 require_once '../db/config.php';
 
+$pdo = db();
+
 // Handle user actions (delete, toggle status)
 if ($_SERVER['REQUEST_METHOD'] === 'POST') {
-    $pdo = db();
+    $userId = filter_input(INPUT_POST, 'user_id', FILTER_VALIDATE_INT);
+    if ($userId && $userId != $_SESSION['user_id']) { // Prevent admin from deleting themselves
         if (isset($_POST['delete_user'])) {
-        $userId = $_POST['user_id'];
             $stmt = $pdo->prepare("DELETE FROM users WHERE id = ?");
             $stmt->execute([$userId]);
         } elseif (isset($_POST['toggle_status'])) {
-        $userId = $_POST['user_id'];
+            $stmt = $pdo->prepare("UPDATE users SET status = IF(status = 'active', 'disabled', 'active') WHERE id = ?");
-        $stmt = $pdo->prepare("UPDATE users SET status = CASE WHEN status = 'active' THEN 'disabled' ELSE 'active' END WHERE id = ?");
             $stmt->execute([$userId]);
         }
+    }
     header("Location: users.php");
     exit();
 }
 
+// Fetch users with filters
 $search = $_GET['search'] ?? '';
-$filter = $_GET['filter'] ?? 'all';
+$filter_status = $_GET['status'] ?? 'all';
 
-try {
-    $pdo = db();
 $sql = "SELECT id, username, email, role, created_at, status FROM users";
 $params = [];
+$where = [];
 
 if (!empty($search)) {
-        $sql .= " WHERE (username LIKE ? OR email LIKE ?)";
+    $where[] = "(username LIKE ? OR email LIKE ?)";
     $params[] = "%$search%";
     $params[] = "%$search%";
 }
-
+if ($filter_status !== 'all') {
-    if ($filter !== 'all') {
+    $where[] = "status = ?";
-        $sql .= (strpos($sql, 'WHERE') === false ? " WHERE" : " AND") . " status = ?";
+    $params[] = $filter_status;
-        $params[] = $filter;
+}
+if (!empty($where)) {
+    $sql .= " WHERE " . implode(' AND ', $where);
 }
 
 $sql .= " ORDER BY created_at DESC";
 $stmt = $pdo->prepare($sql);
 $stmt->execute($params);
 $users = $stmt->fetchAll(PDO::FETCH_ASSOC);
-} catch (PDOException $e) {
-    error_log("Admin Users Page Error: " . $e->getMessage());
-    $users = [];
-}
 
 $projectName = 'Manage Users';
 ?>
@@ -59,101 +59,70 @@ $projectName = 'Manage Users';
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title><?php echo htmlspecialchars($projectName); ?></title>
+    <title><?= htmlspecialchars($projectName) ?></title>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?= time() ?>">
-    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
 </head>
-<body class="admin-dashboard">
+<body>
-
+    <div class="admin-wrapper">
-    <?php include __DIR__ . '/../partials/navbar.php'; ?>
+        <?php include 'partials/sidebar.php'; ?>
-
+        <main class="admin-main-content">
             <div class="container-fluid">
-        <div class="row">
+                <div class="d-flex justify-content-between align-items-center pt-3 pb-2 mb-3 border-bottom">
-            <nav id="sidebar" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
-                <div class="position-sticky pt-3">
-                    <ul class="nav flex-column">
-                        <li class="nav-item"><a class="nav-link" href="index.php"><i class="bi bi-house-door"></i> Dashboard</a></li>
-                        <li class="nav-item"><a class="nav-link active" aria-current="page" href="users.php"><i class="bi bi-people"></i> Manage Users</a></li>
-                        <li class="nav-item"><a class="nav-link" href="cars.php"><i class="bi bi-car-front"></i> Manage Cars</a></li>
-                        <li class="nav-item"><a class="nav-link" href="bookings.php"><i class="bi bi-calendar-check"></i> Manage Bookings</a></li>
-                        <li class="nav-item"><a class="nav-link" href="reviews.php"><i class="bi bi-star-fill"></i> Manage Reviews</a></li>
-                    </ul>
-                </div>
-            </nav>
-
-            <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
-                <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
                     <h1 class="h2">Manage Users</h1>
                 </div>
 
                 <div class="card">
-                    <div class="card-header">
-                        <form method="GET" action="users.php" class="row g-3 align-items-center">
-                            <div class="col-auto">
-                                <input type="text" name="search" class="form-control" placeholder="Search by name or email..." value="<?php echo htmlspecialchars($search); ?>">
-                            </div>
-                            <div class="col-auto">
-                                <select name="filter" class="form-select">
-                                    <option value="all" <?php if ($filter === 'all') echo 'selected'; ?>>All Statuses</option>
-                                    <option value="active" <?php if ($filter === 'active') echo 'selected'; ?>>Active</option>
-                                    <option value="disabled" <?php if ($filter === 'disabled') echo 'selected'; ?>>Disabled</option>
-                                </select>
-                            </div>
-                            <div class="col-auto">
-                                <button type="submit" class="btn btn-primary">Filter</button>
-                            </div>
-                        </form>
-                    </div>
                     <div class="card-body">
                         <div class="table-responsive">
-                            <table class="table table-striped table-hover">
+                            <table class="table table-hover align-middle">
-                                <thead class="table-dark">
+                                <thead class="table-light">
-                                    <tr>
+                                    <tr><th>User</th><th>Role</th><th>Status</th><th>Joined</th><th>Actions</th></tr>
-                                        <th>ID</th>
-                                        <th>Username</th>
-                                        <th>Email</th>
-                                        <th>Role</th>
-                                        <th>Status</th>
-                                        <th>Joined On</th>
-                                        <th>Actions</th>
-                                    </tr>
                                 </thead>
                                 <tbody>
+                                    <?php if (empty($users)): ?>
+                                        <tr><td colspan="5" class="text-center">No users found.</td></tr>
+                                    <?php endif; ?>
                                     <?php foreach ($users as $user): ?>
                                     <tr>
-                                        <td><?php echo htmlspecialchars($user['id']); ?></td>
-                                        <td><?php echo htmlspecialchars($user['username']); ?></td>
-                                        <td><?php echo htmlspecialchars($user['email']); ?></td>
-                                        <td><span class="badge bg-<?php echo $user['role'] === 'admin' ? 'success' : 'info'; ?>"><?php echo htmlspecialchars($user['role']); ?></span></td>
-                                        <td><span class="badge bg-<?php echo $user['status'] === 'active' ? 'success' : 'warning'; ?>"><?php echo htmlspecialchars($user['status']); ?></span></td>
-                                        <td><?php echo date("M d, Y", strtotime($user['created_at'])); ?></td>
                                         <td>
-                                            <form method="POST" action="users.php" class="d-inline">
+                                            <div class="d-flex align-items-center">
-                                                <input type="hidden" name="user_id" value="<?php echo $user['id']; ?>">
+                                                <img src="https://i.pravatar.cc/40?u=<?= htmlspecialchars($user['email']) ?>" class="rounded-circle me-3" alt="<?= htmlspecialchars($user['username']) ?>">
-                                                <button type="submit" name="toggle_status" class="btn btn-sm btn-outline-secondary">
+                                                <div>
-                                                    <i class="bi bi-person-fill-<?php echo $user['status'] === 'active' ? 'slash' : 'check'; ?>"></i>
+                                                    <b><?= htmlspecialchars($user['username']) ?></b>
+                                                    <div class="text-muted"><?= htmlspecialchars($user['email']) ?></div>
+                                                </div>
+                                            </div>
+                                        </td>
+                                        <td><span class="badge bg-<?= $user['role'] === 'admin' ? 'primary' : 'secondary' ?>"><?= htmlspecialchars(ucfirst($user['role'])) ?></span></td>
+                                        <td><span class="badge rounded-pill bg-<?= $user['status'] === 'active' ? 'success' : 'warning' ?>"><?= htmlspecialchars(ucfirst($user['status'])) ?></span></td>
+                                        <td><?= date("M d, Y", strtotime($user['created_at'])) ?></td>
+                                        <td>
+                                            <?php if ($user['id'] != $_SESSION['user_id']): // Prevent admin from editing themselves ?>
+                                            <form method="POST" class="d-inline-flex gap-2">
+                                                <input type="hidden" name="user_id" value="<?= $user['id'] ?>">
+                                                <button type="submit" name="toggle_status" class="btn btn-sm btn-outline-secondary" title="Toggle Status">
+                                                    <i class="bi bi-person-fill-<?= $user['status'] === 'active' ? 'slash' : 'check' ?>"></i>
                                                 </button>
-                                                <button type="submit" name="delete_user" class="btn btn-sm btn-outline-danger" onclick="return confirm('Are you sure?');">
+                                                <button type="submit" name="delete_user" class="btn btn-sm btn-outline-danger" onclick="return confirm('Are you sure you want to delete this user?');" title="Delete User">
                                                     <i class="bi bi-trash"></i>
                                                 </button>
                                             </form>
+                                            <?php else: ?>
+                                                <span class="text-muted fst-italic">Current User</span>
+                                            <?php endif; ?>
                                         </td>
                                     </tr>
                                     <?php endforeach; ?>
-                                    <?php if (empty($users)): ?>
-                                        <tr><td colspan="7" class="text-center">No users found.</td></tr>
-                                    <?php endif; ?>
                                 </tbody>
                             </table>
                         </div>
                     </div>
                 </div>
+            </div>
         </main>
     </div>
-    </div>
-
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
 </body>
 </html>

assets/css/custom.css

@@ -1,195 +1,262 @@
+/* assets/css/custom.css */
+
+/*
+* MODERN, YOUTHFUL & INVITING AESTHETIC
+*
+* - Light, neutral base theme with vibrant accent colors.
+* - Clear, large typography for a strong visual hierarchy.
+* - Comfortably large, prominent interactive elements.
+* - Tasteful soft gradients and subtle shadows.
+* - Optional glassmorphism for a liquid-glass effect.
+*/
+
+@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Playfair+Display:wght@700&display=swap');
+
 :root {
-    --primary-color: #0f172a;
+    /* Color Palette */
-    --accent-color: #ea580c;
+    --primary-color: #4f46e5; /* Vibrant Indigo */
-    --bg-color: #f8fafc;
+    --secondary-color: #10b981; /* Bright Emerald */
-    --surface-color: #ffffff;
+    --accent-color: #ec4899; /* Hot Pink */
-    --text-color: #1e293b;
+    --bg-color: #f9fafb; /* Very Light Gray */
-    --text-muted: #64748b;
+    --surface-color: #ffffff; /* White */
-    --border-color: #e2e8f0;
+    --text-color: #1f2937; /* Dark Gray */
-    --card-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
+    --text-muted: #6b7280; /* Medium Gray */
-}
+    --border-color: #e5e7eb; /* Light Gray */
-
+
-body.dark-mode {
+    /* Typography */
-    --primary-color: #f8fafc;
+    --font-primary: 'Poppins', sans-serif;
-    --accent-color: #f97316;
+    --font-display: 'Playfair Display', serif;
-    --bg-color: #0f172a;
+
-    --surface-color: #1e293b;
+    /* Effects */
-    --text-color: #f1f5f9;
+    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
-    --text-muted: #94a3b8;
+    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
-    --border-color: #334155;
+    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
-    --card-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.5);
+    --border-radius: 0.75rem; /* 12px */
 }
 
+/* Base & Typography */
 body {
-    font-family: 'Inter', system-ui, -apple-system, sans-serif;
+    font-family: var(--font-primary);
     background-color: var(--bg-color);
     color: var(--text-color);
-    transition: background-color 0.3s ease, color 0.3s ease;
+    line-height: 1.6;
 }
 
+h1, h2, h3, h4, h5, h6 {
+    font-family: var(--font-display);
+    color: var(--primary-color);
+    font-weight: 700;
+}
+
+h1 { font-size: 3rem; }
+h2 { font-size: 2.25rem; }
+h3 { font-size: 1.875rem; }
+
+a {
+    color: var(--primary-color);
+    text-decoration: none;
+    transition: color 0.3s ease;
+}
+
+a:hover {
+    color: var(--accent-color);
+}
+
+/* Layout & Containers */
+.container {
+    max-width: 1200px;
+}
+
+.section-padding {
+    padding: 6rem 0;
+}
+
+/* Navbar */
 .navbar {
-    background-color: rgba(255, 255, 255, 0.95);
+    background: rgba(255, 255, 255, 0.7);
     backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
     border-bottom: 1px solid var(--border-color);
-}
+    box-shadow: var(--shadow-sm);
-
+    padding: 1rem 0;
-body.dark-mode .navbar {
-    background-color: rgba(15, 23, 42, 0.95);
-    border-bottom: 1px solid var(--border-color);
 }
 
 .navbar-brand {
+    font-family: var(--font-display);
     font-weight: 700;
-    color: var(--text-color) !important;
+    font-size: 1.75rem;
+    color: var(--primary-color) !important;
 }
 
 .nav-link {
+    font-weight: 600;
     color: var(--text-muted) !important;
-    font-weight: 500;
+    padding: 0.5rem 1rem !important;
+    border-radius: var(--border-radius);
+    transition: all 0.3s ease;
 }
 
 .nav-link:hover, .nav-link.active {
     color: var(--accent-color) !important;
+    background-color: rgba(236, 72, 153, 0.1);
 }
 
-.hero-section {
+/* Buttons */
-    position: relative;
+.btn {
-    padding: 8rem 0 6rem;
+    font-weight: 600;
-    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
+    padding: 0.8rem 2rem;
-    color: white;
+    border-radius: var(--border-radius);
-    border-radius: 0 0 2rem 2rem;
+    border: none;
-    margin-bottom: 4rem;
+    transition: all 0.3s ease;
-    overflow: hidden;
+    box-shadow: var(--shadow-md);
-}
-
-.hero-bg-overlay {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background-image: url('https://images.pexels.com/photos/120049/pexels-photo-120049.jpeg?auto=compress&cs=tinysrgb&w=1600');
-    background-size: cover;
-    background-position: center;
-    opacity: 0.2;
-    z-index: 0;
-}
-
-.hero-content {
-    position: relative;
-    z-index: 1;
-}
-
-.search-card {
-    background-color: var(--surface-color);
-    border-radius: 1rem;
-    padding: 1.5rem;
-    box-shadow: 0 10px 25px -5px rgb(0 0 0 / 0.1);
-    margin-top: 2rem;
-    border: 1px solid var(--border-color);
-}
-
-.form-control, .form-select {
-    background-color: var(--bg-color);
-    border: 1px solid var(--border-color);
-    color: var(--text-color);
-    padding: 0.75rem 1rem;
-    border-radius: 0.5rem;
-}
-
-.form-control:focus, .form-select:focus {
-    background-color: var(--bg-color);
-    border-color: var(--accent-color);
-    color: var(--text-color);
-    box-shadow: 0 0 0 2px rgba(234, 88, 12, 0.2);
 }
 
 .btn-primary {
-    background-color: var(--accent-color);
+    background: linear-gradient(45deg, var(--primary-color), var(--secondary-color));
-    border-color: var(--accent-color);
+    color: white;
-    padding: 0.75rem 1.5rem;
-    font-weight: 600;
 }
 
 .btn-primary:hover {
-    background-color: #c2410c;
+    transform: translateY(-2px);
-    border-color: #c2410c;
+    box-shadow: var(--shadow-lg);
 }
 
-.section-title {
+.btn-secondary {
-    font-weight: 700;
-    margin-bottom: 2rem;
-    position: relative;
-    display: inline-block;
-}
-
-.section-title::after {
-    content: '';
-    position: absolute;
-    left: 0;
-    bottom: -10px;
-    width: 60px;
-    height: 4px;
-    background-color: var(--accent-color);
-    border-radius: 2px;
-}
-
-.car-card {
     background-color: var(--surface-color);
+    color: var(--primary-color);
     border: 1px solid var(--border-color);
-    border-radius: 1rem;
+}
+
+.btn-secondary:hover {
+    background-color: var(--bg-color);
+}
+
+/* Forms & Inputs */
+.form-control, .form-select {
+    padding: 1rem;
+    border: 1px solid var(--border-color);
+    border-radius: var(--border-radius);
+    background-color: var(--surface-color);
+    transition: all 0.3s ease;
+    font-size: 1rem;
+}
+
+.form-control:focus, .form-select:focus {
+    outline: none;
+    border-color: var(--primary-color);
+    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.2);
+}
+
+.form-label {
+    font-weight: 600;
+    margin-bottom: 0.5rem;
+}
+
+/* Cards */
+.card {
+    background-color: var(--surface-color);
+    border: none;
+    border-radius: var(--border-radius);
+    box-shadow: var(--shadow-md);
     overflow: hidden;
-    transition: transform 0.3s ease, box-shadow 0.3s ease;
+    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
     height: 100%;
 }
 
-.car-card:hover {
+.card:hover {
-    transform: translateY(-5px);
+    transform: translateY(-10px);
-    box-shadow: var(--card-shadow);
+    box-shadow: var(--shadow-lg);
 }
 
-.car-img-top {
+.card-img-top {
-    height: 220px;
+    height: 250px;
     object-fit: cover;
 }
 
-.car-card-body {
+.card-body {
-    padding: 1.5rem;
+    padding: 1.75rem;
 }
 
-.price-tag {
+.card-title {
-    color: var(--accent-color);
+    font-family: var(--font-primary);
-    font-weight: 700;
+    font-weight: 600;
     font-size: 1.25rem;
 }
 
-.spec-item {
+/* Login/Register Form */
-    color: var(--text-muted);
+.form-container {
-    font-size: 0.9rem;
     display: flex;
+    justify-content: center;
     align-items: center;
-    gap: 0.5rem;
+    min-height: 100vh;
+    background: linear-gradient(-45deg, #e0c3fc, #8ec5fc);
 }
 
-.spec-item i {
+.auth-card {
-    color: var(--accent-color);
+    width: 100%;
+    max-width: 450px;
+    padding: 3rem;
 }
 
+/* Admin Dashboard */
+.admin-wrapper {
+    display: flex;
+}
+
+.admin-sidebar {
+    width: 260px;
+    background: var(--primary-color);
+    color: white;
+    min-height: 100vh;
+    padding: 2rem 1rem;
+    position: fixed;
+    height: 100%;
+}
+
+.admin-sidebar .navbar-brand {
+    color: white !important;
+}
+
+.admin-sidebar .nav-link {
+    color: rgba(255, 255, 255, 0.7) !important;
+    font-weight: 500;
+}
+
+.admin-sidebar .nav-link:hover, .admin-sidebar .nav-link.active {
+    color: white !important;
+    background-color: rgba(255, 255, 255, 0.1);
+}
+
+.admin-main-content {
+    margin-left: 260px;
+    padding: 2rem;
+    width: calc(100% - 260px);
+}
+
+.stat-card {
+    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
+    color: white;
+    padding: 2rem;
+    border-radius: var(--border-radius);
+    margin-bottom: 1.5rem;
+}
+
+.stat-card h4 {
+    color: white;
+}
+
+/* Footer */
 .footer {
-    background-color: var(--surface-color);
+    background-color: var(--text-color);
-    border-top: 1px solid var(--border-color);
+    color: var(--bg-color);
     padding: 4rem 0 2rem;
     margin-top: 4rem;
 }
 
-/* Dark mode toggler */
+.footer a {
-.theme-toggle {
+    color: var(--secondary-color);
-    cursor: pointer;
-    padding: 0.5rem;
-    border-radius: 50%;
-    transition: background-color 0.2s;
 }
 
-.theme-toggle:hover {
+.footer a:hover {
-    background-color: rgba(128, 128, 128, 0.1);
+    color: var(--accent-color);
 }

assets/js/main.js

@@ -1,9 +1,10 @@
 document.addEventListener('DOMContentLoaded', () => {
-    const themeToggleBtn = document.getElementById('theme-toggle');
+    const themeToggle = document.querySelector('.theme-toggle');
-    const body = document.body;
+
-    const icon = themeToggleBtn.querySelector('i');
+    if (themeToggle) {
+        const body = document.body;
+        const icon = themeToggle.querySelector('i');
 
-    // Check local storage
         const currentTheme = localStorage.getItem('theme');
         if (currentTheme === 'dark') {
             body.classList.add('dark-mode');
@@ -11,7 +12,7 @@ document.addEventListener('DOMContentLoaded', () => {
             icon.classList.add('bi-sun-fill');
         }
 
-    themeToggleBtn.addEventListener('click', () => {
+        themeToggle.addEventListener('click', () => {
             body.classList.toggle('dark-mode');
 
             if (body.classList.contains('dark-mode')) {
@@ -24,4 +25,5 @@ document.addEventListener('DOMContentLoaded', () => {
                 icon.classList.add('bi-moon-fill');
             }
         });
+    }
 });

car_detail.php

@@ -1,44 +1,62 @@
 <?php
 session_start();
-require_once 'db/config.php';
+require_once __DIR__ . '/db/config.php';
 
-if (!isset($_GET['id'])) {
+if (!isset($_GET['id']) || !is_numeric($_GET['id'])) {
     header("Location: car_list.php");
     exit();
 }
 
-$carId = $_GET['id'];
+$carId = (int)$_GET['id'];
 $pdo = db();
+$message = '';
+$message_type = '';
 
-// Handle Booking
+// Handle POST requests (Booking or Review)
-if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['book_now'])) {
+if ($_SERVER['REQUEST_METHOD'] === 'POST') {
     if (!isset($_SESSION['user_id'])) {
         header("Location: login.php");
         exit();
     }
     $userId = $_SESSION['user_id'];
-    $stmt = $pdo->prepare("INSERT INTO bookings (user_id, car_id) VALUES (?, ?)");
+
+    // Booking Logic
+    if (isset($_POST['book_now'])) {
+        try {
+            $pdo->beginTransaction();
+            $stmt = $pdo->prepare("INSERT INTO bookings (user_id, car_id, status) VALUES (?, ?, 'pending')");
             $stmt->execute([$userId, $carId]);
-    $stmt = $pdo->prepare("UPDATE cars SET status = 'reserved' WHERE id = ?");
+            $stmt = $pdo->prepare("UPDATE cars SET status = 'reserved' WHERE id = ? AND status = 'approved'");
             $stmt->execute([$carId]);
-    $booking_success = "Your booking request has been sent!";
+            $pdo->commit();
+            $message = "Your booking request has been sent! The car is reserved for you pending admin approval.";
+            $message_type = 'success';
+        } catch (Exception $e) {
+            $pdo->rollBack();
+            error_log("Booking failed: " . $e->getMessage());
+            $message = "There was an error processing your booking. Please try again.";
+            $message_type = 'danger';
+        }
     }
 
-// Handle Review
+    // Review Logic
-if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['submit_review'])) {
+    if (isset($_POST['submit_review'])) {
-    if (!isset($_SESSION['user_id'])) {
+        $rating = filter_input(INPUT_POST, 'rating', FILTER_VALIDATE_INT, ['options' => ['min_range' => 1, 'max_range' => 5]]);
-        header("Location: login.php");
+        $review_text = trim(filter_input(INPUT_POST, 'review', FILTER_SANITIZE_SPECIAL_CHARS));
-        exit();
-    }
-    $userId = $_SESSION['user_id'];
-    $rating = $_POST['rating'];
-    $review = $_POST['review'];
         
+        if ($rating && !empty($review_text)) {
             $stmt = $pdo->prepare("INSERT INTO reviews (car_id, user_id, rating, review) VALUES (?, ?, ?, ?)");
-    $stmt->execute([$carId, $userId, $rating, $review]);
+            $stmt->execute([$carId, $userId, $rating, $review_text]);
-    $review_success = "Your review has been submitted for approval!";
+            $message = "Your review has been submitted and is pending approval.";
+            $message_type = 'success';
+        } else {
+            $message = "Invalid rating or review text.";
+            $message_type = 'danger';
+        }
+    }
 }
 
+// Fetch car details
 $stmt = $pdo->prepare("SELECT * FROM cars WHERE id = ?");
 $stmt->execute([$carId]);
 $car = $stmt->fetch(PDO::FETCH_ASSOC);
@@ -48,7 +66,7 @@ if (!$car) {
     exit();
 }
 
-// Fetch Reviews
+// Fetch approved reviews
 $stmt = $pdo->prepare("SELECT r.*, u.username FROM reviews r JOIN users u ON r.user_id = u.id WHERE r.car_id = ? AND r.status = 'approved' ORDER BY r.created_at DESC");
 $stmt->execute([$carId]);
 $reviews = $stmt->fetchAll(PDO::FETCH_ASSOC);
@@ -60,89 +78,117 @@ $projectName = htmlspecialchars($car['make'] . ' ' . $car['model']);
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title><?= $projectName ?></title>
+    <title><?= $projectName ?> - Car Sells Afghanistan</title>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
     <link rel="stylesheet" href="assets/css/custom.css?v=<?= time() ?>">
 </head>
 <body>
     <?php include 'partials/navbar.php'; ?>
 
-    <div class="container mt-5">
+    <main class="section-padding">
-        <div class="row">
+        <div class="container">
-            <div class="col-md-8">
+            <div class="row g-5">
-                <img src="<?= htmlspecialchars($car['image_url']) ?>" class="img-fluid rounded" alt="<?= $projectName ?>">
+                <!-- Car Image Gallery -->
+                <div class="col-lg-7">
+                    <img src="<?= htmlspecialchars($car['image_url'] ?: 'https://via.placeholder.com/800x600?text=Car+Image') ?>" class="img-fluid rounded shadow-lg w-100" alt="<?= $projectName ?>">
                 </div>
-            <div class="col-md-4">
-                <h1><?= $projectName ?></h1>
-                <p class="lead"><?= htmlspecialchars($car['description']) ?></p>
-                <p><strong>Year:</strong> <?= htmlspecialchars($car['year']) ?></p>
-                <p><strong>Price:</strong> $<?= number_format($car['price']) ?></p>
-                <p><strong>Status:</strong> <span class="badge bg-info"><?= htmlspecialchars($car['status']) ?></span></p>
 
-                <?php if (isset($booking_success)): ?>
+                <!-- Car Details & Booking -->
-                    <div class="alert alert-success"><?= $booking_success ?></div>
+                <div class="col-lg-5">
+                    <h1 class="h2 mb-2"><?= $projectName ?></h1>
+                    <p class="text-muted fs-5 mb-4"><i class="bi bi-geo-alt-fill me-2"></i><?= htmlspecialchars($car['city'] . ', ' . $car['province']) ?></p>
+                    
+                    <p class="lead mb-4"><?= htmlspecialchars($car['description']) ?></p>
+
+                    <div class="card p-4 mb-4">
+                        <h3 class="h5 mb-3">Key Specifications</h3>
+                        <div class="row g-3 fs-6">
+                            <div class="col-6"><i class="bi bi-calendar-event me-2 text-primary"></i> <strong>Year:</strong> <?= htmlspecialchars($car['year']) ?></div>
+                            <div class="col-6"><i class="bi bi-palette me-2 text-primary"></i> <strong>Color:</strong> <?= htmlspecialchars($car['color'] ?? 'N/A') ?></div>
+                            <div class="col-6"><i class="bi bi-speedometer2 me-2 text-primary"></i> <strong>Mileage:</strong> <?= number_format($car['mileage']) ?> km</div>
+                            <div class="col-6"><i class="bi bi-fuel-pump me-2 text-primary"></i> <strong>Fuel:</strong> Petrol</div>
+                        </div>
+                    </div>
+
+                    <div class="text-end mb-4">
+                        <span class="display-5 fw-bold" style="color: var(--secondary-color);">$<?= number_format($car['price']) ?></span>
+                    </div>
+
+                    <?php if (!empty($message)): ?>
+                        <div class="alert alert-<?= $message_type ?>"><?= $message ?></div>
                     <?php endif; ?>
 
-                <?php if ($car['status'] === 'for_sale'): ?>
+                    <?php if ($car['status'] === 'approved'): ?>
-                <form method="POST">
+                        <form method="POST" class="d-grid">
-                    <button type="submit" name="book_now" class="btn btn-success btn-lg">Book Now</button>
+                            <button type="submit" name="book_now" class="btn btn-primary btn-lg">Book This Car Now</button>
                         </form>
+                    <?php else: ?>
+                        <div class="alert alert-info text-center">This car is currently <strong class="text-capitalize"><?= htmlspecialchars($car['status']) ?></strong> and cannot be booked.</div>
                     <?php endif; ?>
                 </div>
             </div>
 
             <hr class="my-5">
 
-        <!-- Reviews Section -->
+            <!-- Reviews Section from previous steps remains unchanged -->
-        <div class="row">
+            <div class="row justify-content-center">
-            <div class="col-md-8">
+                <div class="col-lg-8">
-                <h2>Reviews</h2>
+                    <h2 class="text-center mb-5">Customer Reviews</h2>
-                <?php if (isset($review_success)): ?>
-                    <div class="alert alert-success"><?= $review_success ?></div>
-                <?php endif; ?>
 
                     <?php if (isset($_SESSION['user_id'])): ?>
-                <div class="card mb-4">
+                    <div class="card mb-5">
-                    <div class="card-body">
+                        <div class="card-body p-4">
-                        <h5 class="card-title">Leave a Review</h5>
+                            <h4 class="card-title mb-3">Leave Your Feedback</h4>
                             <form method="POST">
                                 <div class="mb-3">
-                                <label for="rating" class="form-label">Rating</label>
+                                    <label for="rating" class="form-label">Your Rating (1-5)</label>
                                     <select name="rating" id="rating" class="form-select" required>
-                                    <option value="5">5 Stars</option>
+                                        <option value="">Select a rating</option>
-                                    <option value="4">4 Stars</option>
+                                        <option value="5">★★★★★ (Excellent)</option>
-                                    <option value="3">3 Stars</option>
+                                        <option value="4">★★★★☆ (Great)</option>
-                                    <option value="2">2 Stars</option>
+                                        <option value="3">★★★☆☆ (Good)</option>
-                                    <option value="1">1 Star</option>
+                                        <option value="2">★★☆☆☆ (Fair)</option>
+                                        <option value="1">★☆☆☆☆ (Poor)</option>
                                     </select>
                                 </div>
                                 <div class="mb-3">
-                                <label for="review" class="form-label">Review</label>
+                                    <label for="review" class="form-label">Your Review</label>
-                                <textarea name="review" id="review" class="form-control" rows="3" required></textarea>
+                                    <textarea name="review" id="review" class="form-control" rows="4" placeholder="Share your experience with this car..." required></textarea>
                                 </div>
                                 <button type="submit" name="submit_review" class="btn btn-primary">Submit Review</button>
                             </form>
                         </div>
                     </div>
                     <?php else: ?>
-                    <p><a href="login.php">Log in</a> to leave a review.</p>
+                        <p class="text-center"><a href="login.php">Log in</a> to share your experience.</p>
                     <?php endif; ?>
 
+                    <?php if (empty($reviews)): ?>
+                        <p class="text-center text-muted">Be the first to write a review for this car!</p>
+                    <?php else: ?>
                         <?php foreach ($reviews as $review): ?>
                         <div class="card mb-3">
-                    <div class="card-body">
+                            <div class="card-body d-flex">
-                        <h6 class="card-subtitle mb-2 text-muted"><strong><?= htmlspecialchars($review['username']) ?></strong> - <?= date("M d, Y", strtotime($review['created_at'])) ?></h6>
+                                <div class="flex-shrink-0 me-3">
-                        <p class="card-text">Rating: <?= str_repeat('&#9733;', $review['rating']) ?></p>
+                                    <img src="https://i.pravatar.cc/60?u=<?= htmlspecialchars($review['username']) ?>" alt="" class="rounded-circle">
-                        <p class="card-text"><?= htmlspecialchars($review['review']) ?></p>
+                                </div>
+                                <div>
+                                    <h5 class="mt-0 mb-1"><?= htmlspecialchars($review['username']) ?></h5>
+                                    <div class="text-warning mb-2">
+                                        <?= str_repeat('★', $review['rating']) . str_repeat('☆', 5 - $review['rating']) ?>
+                                    </div>
+                                    <p class="mb-1"><?= nl2br(htmlspecialchars($review['review'])) ?></p>
+                                    <small class="text-muted"><?= date("F j, Y", strtotime($review['created_at'])) ?></small>
+                                </div>
                             </div>
                         </div>
                         <?php endforeach; ?>
-                <?php if (empty($reviews)): ?>
-                    <p>No reviews yet.</p>
                     <?php endif; ?>
                 </div>
             </div>
         </div>
+    </main>
 
     <?php include 'partials/footer.php'; ?>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>

car_list.php

@@ -1,68 +1,149 @@
 <?php
 session_start();
-require_once 'db/config.php';
+require_once __DIR__ . '/db/config.php';
 
 $pdo = db();
-$search = $_GET['search'] ?? '';
 
-$sql = "SELECT * FROM cars WHERE status = 'for_sale'";
+// Filtering Logic
+$whereClauses = ["status = 'approved'"];
 $params = [];
-if (!empty($search)) {
+
-    $sql .= " AND (make LIKE ? OR model LIKE ?)";
+if (!empty($_GET['make'])) {
-    $params[] = "%$search%";
+    $whereClauses[] = "make = ?";
-    $params[] = "%$search%";
+    $params[] = $_GET['make'];
+}
+if (!empty($_GET['province'])) {
+    $whereClauses[] = "province = ?";
+    $params[] = $_GET['province'];
+}
+if (!empty($_GET['min_price'])) {
+    $whereClauses[] = "price >= ?";
+    $params[] = $_GET['min_price'];
+}
+if (!empty($_GET['max_price'])) {
+    $whereClauses[] = "price <= ?";
+    $params[] = $_GET['max_price'];
+}
+if (!empty($_GET['search'])) {
+    $whereClauses[] = "(model LIKE ? OR description LIKE ?)";
+    $searchTerm = "%{$_GET['search']}%";
+    $params[] = $searchTerm;
+    $params[] = $searchTerm;
+}
+
+$sql = "SELECT * FROM cars";
+if (!empty($whereClauses)) {
+    $sql .= " WHERE " . implode(' AND ', $whereClauses);
 }
 $sql .= " ORDER BY created_at DESC";
+
 $stmt = $pdo->prepare($sql);
 $stmt->execute($params);
 $cars = $stmt->fetchAll(PDO::FETCH_ASSOC);
 
-$projectName = 'Available Cars';
+// Fetch distinct makes and provinces for filter dropdowns
+$makes = $pdo->query("SELECT DISTINCT make FROM cars WHERE status = 'approved' ORDER BY make ASC")->fetchAll(PDO::FETCH_COLUMN);
+$provinces = $pdo->query("SELECT DISTINCT province FROM cars WHERE status = 'approved' AND province IS NOT NULL ORDER BY province ASC")->fetchAll(PDO::FETCH_COLUMN);
+
+$projectName = 'All Car Listings';
 ?>
 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title><?= htmlspecialchars($projectName) ?></title>
+    <title><?= htmlspecialchars($projectName) ?> - Car Sells Afghanistan</title>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
     <link rel="stylesheet" href="assets/css/custom.css?v=<?= time() ?>">
 </head>
 <body>
     <?php include 'partials/navbar.php'; ?>
 
-    <div class="container mt-5">
+    <header class="bg-light py-5">
-        <h1 class="text-center mb-4"><?= htmlspecialchars($projectName) ?></h1>
+        <div class="container text-center">
-        <form method="GET" class="row g-3 mb-4 justify-content-center">
+            <h1 class="display-4">Our Vehicle Collection</h1>
-            <div class="col-md-6">
+            <p class="lead text-muted">Browse the complete inventory of our certified pre-owned vehicles from all over Afghanistan.</p>
-                <input type="text" name="search" class="form-control" placeholder="Search by make or model..." value="<?= htmlspecialchars($search) ?>">
         </div>
-            <div class="col-auto">
+    </header>
-                <button type="submit" class="btn btn-primary">Search</button>
+
+    <main class="container section-padding">
+        <div class="row g-5">
+            <aside class="col-lg-3">
+                <div class="card p-4 sticky-top" style="top: 2rem;">
+                    <h4 class="mb-4">Filter Results</h4>
+                    <form method="GET">
+                        <div class="mb-3">
+                            <label for="search" class="form-label">Keyword</label>
+                            <input type="text" name="search" id="search" class="form-control" placeholder="e.g., Corolla, V8" value="<?= htmlspecialchars($_GET['search'] ?? '') ?>">
+                        </div>
+                        <div class="mb-3">
+                            <label for="make" class="form-label">Make</label>
+                            <select name="make" id="make" class="form-select">
+                                <option value="">All Makes</option>
+                                <?php foreach ($makes as $make): ?>
+                                <option value="<?= htmlspecialchars($make) ?>" <?= (($_GET['make'] ?? '') === $make) ? 'selected' : '' ?>><?= htmlspecialchars($make) ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </div>
+                         <div class="mb-3">
+                            <label for="province" class="form-label">Province</label>
+                            <select name="province" id="province" class="form-select">
+                                <option value="">All Provinces</option>
+                                <?php foreach ($provinces as $province): ?>
+                                <option value="<?= htmlspecialchars($province) ?>" <?= (($_GET['province'] ?? '') === $province) ? 'selected' : '' ?>><?= htmlspecialchars($province) ?></option>
+                                <?php endforeach; ?>
+                            </select>
+                        </div>
+                        <div class="mb-3">
+                            <label class="form-label">Price Range ($)</label>
+                            <div class="d-flex gap-2">
+                                <input type="number" name="min_price" class="form-control" placeholder="Min" value="<?= htmlspecialchars($_GET['min_price'] ?? '') ?>">
+                                <input type="number" name="max_price" class="form-control" placeholder="Max" value="<?= htmlspecialchars($_GET['max_price'] ?? '') ?>">
+                            </div>
+                        </div>
+                        <div class="d-grid gap-2">
+                            <button type="submit" class="btn btn-primary">Apply Filters</button>
+                            <a href="car_list.php" class="btn btn-secondary">Reset Filters</a>
                         </div>
                     </form>
+                </div>
+            </aside>
 
-        <div class="row">
+            <div class="col-lg-9">
+                <div class="row g-4">
+                    <?php if (!empty($cars)): ?>
                         <?php foreach ($cars as $car): ?>
-            <div class="col-md-4 mb-4">
+                        <div class="col-md-6 col-xl-4 d-flex align-items-stretch">
-                <div class="card h-100">
+                            <div class="card w-100">
-                    <img src="<?= htmlspecialchars($car['image_url']) ?>" class="card-img-top" alt="<?= htmlspecialchars($car['make'] . ' ' . $car['model']) ?>">
+                                <img src="<?= htmlspecialchars($car['image_url'] ?: 'https://via.placeholder.com/400x300?text=No+Image') ?>" class="card-img-top" alt="<?= htmlspecialchars($car['make'] . ' ' . $car['model']) ?>">
-                    <div class="card-body">
+                                <div class="card-body d-flex flex-column">
                                     <h5 class="card-title"><?= htmlspecialchars($car['make'] . ' ' . $car['model']) ?></h5>
-                        <p class="card-text"><?= htmlspecialchars($car['description']) ?></p>
+                                    <p class="card-text text-muted"><i class="bi bi-geo-alt-fill me-1"></i> <?= htmlspecialchars($car['city'] . ', ' . $car['province']) ?></p>
-                        <p class="card-text"><strong>Price:</strong> $<?= number_format($car['price']) ?></p>
+                                    <div class="d-flex justify-content-between text-muted small mb-3">
+                                        <span><i class="bi bi-calendar me-1"></i> <?= htmlspecialchars($car['year']) ?></span>
+                                        <span><i class="bi bi-speedometer2 me-1"></i> <?= number_format($car['mileage']) ?> km</span>
+                                    </div>
+                                    <h4 class="mt-auto mb-3 text-end fw-bold" style="color: var(--secondary-color);">$<?= number_format($car['price']) ?></h4>
                                     <a href="car_detail.php?id=<?= $car['id'] ?>" class="btn btn-primary">View Details</a>
                                 </div>
                             </div>
                         </div>
                         <?php endforeach; ?>
-            <?php if (empty($cars)): ?>
+                    <?php else: ?>
                         <div class="col-12">
-                <p class="text-center">No cars found.</p>
+                            <div class="alert alert-warning text-center" role="alert">
+                                <h4 class="alert-heading">No Cars Found!</h4>
+                                <p>Your search did not match any of our vehicles. Try adjusting your filters or check back later.</p>
+                                <hr>
+                                <a href="car_list.php" class="btn btn-dark">Clear Filters and See All Cars</a>
+                            </div>
                         </div>
                     <?php endif; ?>
                 </div>
             </div>
+        </div>
+    </main>
 
     <?php include 'partials/footer.php'; ?>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>

db/setup_cars.php

@@ -3,76 +3,86 @@ require_once __DIR__ . '/config.php';
 
 try {
     $pdo = db();
+    echo "Connected to database successfully.<br>";
 
-    // Create cars table
+    // Idempotently add columns to the cars table if they don't exist
-    $sql = "CREATE TABLE IF NOT EXISTS cars (
+    $columns_to_add = [
-        id INT AUTO_INCREMENT PRIMARY KEY,
+        'status' => "ALTER TABLE cars ADD COLUMN status VARCHAR(50) NOT NULL DEFAULT 'pending'",
-        make VARCHAR(50) NOT NULL,
+        'color' => "ALTER TABLE cars ADD COLUMN color VARCHAR(50)",
-        model VARCHAR(50) NOT NULL,
+        'province' => "ALTER TABLE cars ADD COLUMN province VARCHAR(100)",
-        year INT NOT NULL,
+        'city' => "ALTER TABLE cars ADD COLUMN city VARCHAR(100)",
-        price DECIMAL(10, 2) NOT NULL,
-        mileage INT DEFAULT 0,
-        image_url VARCHAR(255),
-        description TEXT,
-        created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
-    )";
-    $pdo->exec($sql);
-    echo "Table 'cars' created or already exists.<br>";
-
-    // Check if empty
-    $stmt = $pdo->query("SELECT COUNT(*) FROM cars");
-    if ($stmt->fetchColumn() == 0) {
-        // Seed data
-        $cars = [
-            [
-                'make' => 'Toyota',
-                'model' => 'Corolla',
-                'year' => 2015,
-                'price' => 12500.00,
-                'mileage' => 45000,
-                'image_url' => 'https://images.pexels.com/photos/170811/pexels-photo-170811.jpeg?auto=compress&cs=tinysrgb&w=800',
-                'description' => 'Reliable white Corolla, excellent condition. Kabul plate.'
-            ],
-            [
-                'make' => 'Toyota',
-                'model' => 'Land Cruiser',
-                'year' => 2018,
-                'price' => 45000.00,
-                'mileage' => 32000,
-                'image_url' => 'https://images.pexels.com/photos/116675/pexels-photo-116675.jpeg?auto=compress&cs=tinysrgb&w=800',
-                'description' => 'Black Land Cruiser V8. Powerful and luxurious. Ready for any road.'
-            ],
-            [
-                'make' => 'Mercedes-Benz',
-                'model' => 'C-Class',
-                'year' => 2012,
-                'price' => 18000.00,
-                'mileage' => 60000,
-                'image_url' => 'https://images.pexels.com/photos/112460/pexels-photo-112460.jpeg?auto=compress&cs=tinysrgb&w=800',
-                'description' => 'Silver C-Class. Imported from Germany. Clean interior.'
-            ],
-            [
-                'make' => 'Toyota',
-                'model' => 'Hilux',
-                'year' => 2020,
-                'price' => 28000.00,
-                'mileage' => 15000,
-                'image_url' => 'https://images.pexels.com/photos/119435/pexels-photo-119435.jpeg?auto=compress&cs=tinysrgb&w=800',
-                'description' => 'Double cabin Hilux. Strong engine, barely used.'
-            ]
     ];
 
-        $insertSql = "INSERT INTO cars (make, model, year, price, mileage, image_url, description) VALUES (:make, :model, :year, :price, :mileage, :image_url, :description)";
+    $stmt = $pdo->query("DESCRIBE cars");
+    $existing_columns = $stmt->fetchAll(PDO::FETCH_COLUMN);
+
+    foreach ($columns_to_add as $column => $sql) {
+        if (!in_array($column, $existing_columns)) {
+            $pdo->exec($sql);
+            echo "Column '{$column}' added to 'cars' table.<br>";
+        }
+    }
+
+    // Check if the table is empty before seeding
+    $stmt = $pdo->query("SELECT COUNT(*) FROM cars");
+    if ($stmt->fetchColumn() == 0) {
+        echo "Table 'cars' is empty, proceeding with seeding.<br>";
+        $cars = [
+            [
+                'make' => 'Toyota', 'model' => 'Corolla', 'year' => 2018, 'price' => 13500, 'mileage' => 85000, 'color' => 'White', 'province' => 'Kabul', 'city' => 'Kabul', 'status' => 'approved',
+                'image_url' => 'https://images.pexels.com/photos/1545743/pexels-photo-1545743.jpeg?auto=compress&cs=tinysrgb&w=800',
+                'description' => 'A well-maintained Corolla, perfect for city driving. Economical and reliable.'
+            ],
+            [
+                'make' => 'Toyota', 'model' => 'Land Cruiser', 'year' => 2020, 'price' => 75000, 'mileage' => 45000, 'color' => 'Black', 'province' => 'Herat', 'city' => 'Herat', 'status' => 'approved',
+                'image_url' => 'https://images.pexels.com/photos/3764984/pexels-photo-3764984.jpeg?auto=compress&cs=tinysrgb&w=800',
+                'description' => 'Powerful V8 Land Cruiser. Armored. Ready for any terrain or situation.'
+            ],
+            [
+                'make' => 'Mercedes-Benz', 'model' => 'C200', 'year' => 2016, 'price' => 22000, 'mileage' => 72000, 'color' => 'Silver', 'province' => 'Balkh', 'city' => 'Mazar-i-Sharif', 'status' => 'approved',
+                'image_url' => 'https://images.pexels.com/photos/241316/pexels-photo-241316.jpeg?auto=compress&cs=tinysrgb&w=800',
+                'description' => 'German luxury and comfort. Smooth ride with a clean interior. -3 plate number.'
+            ],
+            [
+                'make' => 'Toyota', 'model' => 'Hilux', 'year' => 2021, 'price' => 35000, 'mileage' => 25000, 'color' => 'Red', 'province' => 'Kandahar', 'city' => 'Kandahar', 'status' => 'approved',
+                'image_url' => 'https://images.pexels.com/photos/248747/pexels-photo-248747.jpeg?auto=compress&cs=tinysrgb&w=800',
+                'description' => 'Robust and versatile Hilux pickup. Excellent for both work and family.'
+            ],
+            [
+                'make' => 'Honda', 'model' => 'Civic', 'year' => 2019, 'price' => 17000, 'mileage' => 55000, 'color' => 'Blue', 'province' => 'Kabul', 'city' => 'Kabul', 'status' => 'approved',
+                'image_url' => 'https://images.pexels.com/photos/1637859/pexels-photo-1637859.jpeg?auto=compress&cs=tinysrgb&w=800',
+                'description' => 'Sporty and modern Honda Civic. Features a sunroof and great fuel economy.'
+            ],
+            [
+                'make' => 'Ford', 'model' => 'Ranger', 'year' => 2017, 'price' => 24000, 'mileage' => 95000, 'color' => 'Gray', 'province' => 'Nangarhar', 'city' => 'Jalalabad', 'status' => 'pending',
+                'image_url' => 'https://images.pexels.com/photos/119435/pexels-photo-119435.jpeg?auto=compress&cs=tinysrgb&w=800',
+                'description' => 'American toughness. This Ford Ranger is built to handle tough jobs.'
+            ],
+            [
+                'make' => 'Toyota', 'model' => 'RAV4', 'year' => 2018, 'price' => 21000, 'mileage' => 62000, 'color' => 'White', 'province' => 'Herat', 'city' => 'Herat', 'status' => 'approved',
+                'image_url' => 'https://images.pexels.com/photos/707046/pexels-photo-707046.jpeg?auto=compress&cs=tinysrgb&w=800',
+                'description' => 'Family-friendly SUV. Spacious and comfortable for long journeys.'
+            ],
+             [
+                'make' => 'Lexus', 'model' => 'LX 570', 'year' => 2019, 'price' => 85000, 'mileage' => 40000, 'color' => 'Pearl White', 'province' => 'Kabul', 'city' => 'Kabul', 'status' => 'approved',
+                'image_url' => 'https://images.pexels.com/photos/116675/pexels-photo-116675.jpeg?auto=compress&cs=tinysrgb&w=800',
+                'description' => 'The pinnacle of luxury and capability. Top-of-the-line model with all options.'
+            ],
+        ];
+
+        $insertSql = "INSERT INTO cars (make, model, year, price, mileage, color, province, city, status, image_url, description) VALUES (:make, :model, :year, :price, :mileage, :color, :province, :city, :status, :image_url, :description)";
         $stmt = $pdo->prepare($insertSql);
 
+        $count = 0;
         foreach ($cars as $car) {
             $stmt->execute($car);
+            $count++;
         }
-        echo "Seeded " . count($cars) . " cars.<br>";
+        echo "Seeded " . $count . " cars into the database.<br>";
     } else {
-        echo "Table 'cars' already has data.<br>";
+        echo "Table 'cars' already contains data. No seeding performed.<br>";
     }
 
 } catch (PDOException $e) {
-    echo "Error: " . $e->getMessage();
+    echo "Database error: " . $e->getMessage();
 }

db/setup_users.php

@@ -16,16 +16,28 @@ try {
     $pdo->exec($sql);
     echo "Table 'users' created successfully." . PHP_EOL;
 
-    // Add a default admin user if one doesn't exist
+    // Add or update the admin user
-    $stmt = $pdo->prepare("SELECT COUNT(*) FROM users WHERE email = :email");
-    $stmt->execute(['email' => 'admin@example.com']);
-    if ($stmt->fetchColumn() == 0) {
     $username = 'admin';
-        $email = 'admin@example.com';
+    $email = 'admin@admin.com';
-        $password = 'password'; // In a real app, use a stronger password and handle this securely
+    $password = '123';
     $password_hash = password_hash($password, PASSWORD_DEFAULT);
     $role = 'admin';
 
+    $stmt = $pdo->prepare("SELECT COUNT(*) FROM users WHERE username = :username");
+    $stmt->execute([':username' => $username]);
+    
+    if ($stmt->fetchColumn() > 0) {
+        // User exists, update password and email
+        $update_sql = "UPDATE users SET password_hash = :password_hash, email = :email WHERE username = :username";
+        $update_stmt = $pdo->prepare($update_sql);
+        $update_stmt->execute([
+            ':password_hash' => $password_hash,
+            ':email' => $email,
+            ':username' => $username
+        ]);
+        echo "Admin user updated with new password." . PHP_EOL;
+    } else {
+        // User does not exist, insert new admin user
         $insert_sql = "
         INSERT INTO users (username, email, password_hash, role)
         VALUES (:username, :email, :password_hash, :role);
@@ -37,10 +49,9 @@ try {
             ':password_hash' => $password_hash,
             ':role' => $role
         ]);
-        echo "Default admin user created (admin@example.com / password)." . PHP_EOL;
+        echo "Default admin user created (admin / 123)." . PHP_EOL;
     }
 
-
 } catch (PDOException $e) {
     die("DB ERROR: " . $e->getMessage());
 }

index.php

@@ -6,14 +6,15 @@ require_once __DIR__ . '/db/config.php';
 $cars = [];
 try {
     $pdo = db();
-    $stmt = $pdo->query("SELECT * FROM cars ORDER BY created_at DESC LIMIT 4");
+    // Fetch more cars to showcase the design
+    $stmt = $pdo->query("SELECT * FROM cars WHERE status = 'approved' ORDER BY created_at DESC LIMIT 8");
     $cars = $stmt->fetchAll(PDO::FETCH_ASSOC);
 } catch (Exception $e) {
-    // Graceful fallback if DB fails (shouldn't happen given the setup step)
+    error_log("DB Error: " . $e->getMessage());
-    error_log($e->getMessage());
+    // You can set a user-friendly error message here if you want
 }
 
-// Meta variables
+// Meta variables from environment - important for platform integration
 $projectName = getenv('PROJECT_NAME') ?: 'Car Sells in Afghanistan';
 $projectDesc = getenv('PROJECT_DESCRIPTION') ?: 'The best marketplace for buying and selling cars in Afghanistan.';
 $projectImage = getenv('PROJECT_IMAGE_URL') ?: 'https://images.pexels.com/photos/120049/pexels-photo-120049.jpeg?auto=compress&cs=tinysrgb&w=1200';
@@ -23,20 +24,17 @@ $projectImage = getenv('PROJECT_IMAGE_URL') ?: 'https://images.pexels.com/photos
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title><?php echo htmlspecialchars($projectName); ?></title>
+    <title><?php echo htmlspecialchars($projectName); ?> - Modern Car Marketplace</title>
     <meta name="description" content="<?php echo htmlspecialchars($projectDesc); ?>">
     
-    <!-- Open Graph -->
+    <!-- Open Graph / Social Media Meta -->
     <meta property="og:title" content="<?php echo htmlspecialchars($projectName); ?>">
     <meta property="og:description" content="<?php echo htmlspecialchars($projectDesc); ?>">
     <meta property="og:image" content="<?php echo htmlspecialchars($projectImage); ?>">
     
-    <!-- Bootstrap 5 -->
+    <!-- Libs -->
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
-    <!-- Bootstrap Icons -->
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
-    <!-- Google Fonts: Inter -->
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
     <!-- Custom CSS -->
     <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
@@ -46,91 +44,81 @@ $projectImage = getenv('PROJECT_IMAGE_URL') ?: 'https://images.pexels.com/photos
     <?php include 'partials/navbar.php'; ?>
 
     <!-- Hero Section -->
-    <section class="hero-section text-center">
+    <header class="container-fluid vh-100 d-flex align-items-center justify-content-center text-white text-center" style="background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('https://images.pexels.com/photos/3764984/pexels-photo-3764984.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2') no-repeat center center/cover;">
-        <div class="hero-bg-overlay"></div>
-        <div class="container hero-content">
-            <div class="row justify-content-center">
         <div class="col-lg-8">
-                    <h1 class="display-4 fw-bold mb-3">Find Your Dream Car</h1>
+            <h1 class="display-3">Your Dream Car Awaits</h1>
-                    <p class="lead mb-5 text-light opacity-75">The most trusted marketplace for buying and selling cars in Afghanistan.</p>
+            <p class="lead my-4">Discover the best deals on new and used cars in Afghanistan. Quality, trust, and transparency guaranteed.</p>
+            <a href="#featured-cars" class="btn btn-primary btn-lg">Explore Cars</a>
+            <a href="car_list.php" class="btn btn-secondary btn-lg">View All Listings</a>
+        </div>
+    </header>
 
-                    <div class="search-card text-start">
+    <!-- Featured Cars Section -->
-                        <form action="#" method="GET" class="row g-3">
+    <section id="featured-cars" class="section-padding">
-                            <div class="col-md-4">
+        <div class="container">
-                                <label class="form-label small text-muted">Make</label>
+            <div class="text-center mb-5">
-                                <select class="form-select border-0 bg-light">
+                <h2 class="h1">Featured Vehicles</h2>
-                                    <option selected>All Makes</option>
+                <p class="lead text-muted">Hand-picked selection of our finest cars available right now.</p>
-                                    <option>Toyota</option>
-                                    <option>Mercedes</option>
-                                    <option>Honda</option>
-                                </select>
             </div>
-                            <div class="col-md-4">
-                                <label class="form-label small text-muted">Model</label>
-                                <select class="form-select border-0 bg-light">
-                                    <option selected>Any Model</option>
-                                    <option>Corolla</option>
-                                    <option>Camry</option>
-                                    <option>Land Cruiser</option>
-                                </select>
-                            </div>
-                            <div class="col-md-4">
-                                <label class="form-label small text-muted d-block">&nbsp;</label>
-                                <button type="submit" class="btn btn-primary w-100">Search Cars</button>
-                            </div>
-                        </form>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section>
-
-    <!-- Featured Cars -->
-    <section class="container mb-5">
-        <div class="d-flex justify-content-between align-items-center mb-4">
-            <h2 class="section-title h3 mb-0">Featured Cars</h2>
-            <a href="#" class="text-decoration-none fw-semibold">View All <i class="bi bi-arrow-right"></i></a>
-        </div>
-        
             <div class="row g-4">
                 <?php if (!empty($cars)): ?>
-                <?php foreach ($cars as $car): ?>
+                    <?php foreach (array_slice($cars, 0, 4) as $car): // Show only 4 featured ?>
-                <div class="col-md-6 col-lg-3">
+                    <div class="col-md-6 col-lg-3 d-flex align-items-stretch">
-                    <div class="car-card h-100">
+                        <div class="card w-100">
-                        <div class="position-relative">
+                            <img src="<?php echo htmlspecialchars($car['image_url'] ?: 'https://via.placeholder.com/400x300?text=No+Image'); ?>" class="card-img-top" alt="<?php echo htmlspecialchars($car['make'].[ 'model']); ?>">
-                            <img src="<?php echo htmlspecialchars($car['image_url']); ?>" class="card-img-top car-img-top" alt="<?php echo htmlspecialchars($car['make'] . ' ' . $car['model']); ?>">
+                            <div class="card-body d-flex flex-column">
-                            <span class="position-absolute top-0 end-0 m-3 badge bg-dark opacity-75"><?php echo $car['year']; ?></span>
+                                <h5 class="card-title"><?php echo htmlspecialchars($car['make'] . ' ' . $car['model']); ?></h5>
-                        </div>
+                                <p class="card-text text-muted"><?php echo htmlspecialchars($car['year']); ?> &bull; <?php echo number_format($car['mileage']); ?> km</p>
-                        <div class="car-card-body d-flex flex-column">
+                                <h4 class="mt-auto mb-3 text-end">$<?php echo number_format($car['price']); ?></h4>
-                            <h5 class="card-title fw-bold mb-1"><?php echo htmlspecialchars($car['make'] . ' ' . $car['model']); ?></h5>
+                                <a href="car_detail.php?id=<?php echo $car['id']; ?>" class="btn btn-primary">View Details</a>
-                            <p class="text-muted small mb-3 text-truncate"><?php echo htmlspecialchars($car['description']); ?></p>
-                            
-                            <div class="mt-auto">
-                                <div class="d-flex justify-content-between mb-3">
-                                    <div class="spec-item"><i class="bi bi-speedometer2"></i> <?php echo number_format($car['mileage']); ?> km</div>
-                                    <div class="spec-item"><i class="bi bi-fuel-pump"></i> Petrol</div>
-                                </div>
-                                <div class="d-flex justify-content-between align-items-center">
-                                    <span class="price-tag">$<?php echo number_format($car['price']); ?></span>
-                                    <a href="#" class="btn btn-outline-secondary btn-sm rounded-pill">Details</a>
-                                </div>
-                            </div>
                             </div>
                         </div>
                     </div>
                     <?php endforeach; ?>
                 <?php else: ?>
-                <div class="col-12 text-center py-5">
+                    <div class="col-12">
-                    <p class="text-muted">No cars available at the moment. Please check back later.</p>
+                        <div class="alert alert-info text-center">No featured cars available at the moment. Please check back soon!</div>
                     </div>
                 <?php endif; ?>
             </div>
+        </div>
+    </section>
+
+    <!-- How It Works Section -->
+    <section class="section-padding bg-light">
+        <div class="container">
+            <div class="text-center mb-5">
+                <h2 class="h1">How It Works</h2>
+                <p class="lead text-muted">A simple, transparent, and secure process.</p>
+            </div>
+            <div class="row g-4 text-center">
+                <div class="col-md-4">
+                    <div class="card p-4 h-100">
+                        <i class="bi bi-search fs-1 text-primary mb-3"></i>
+                        <h3>1. Find Your Car</h3>
+                        <p>Browse our curated selection of high-quality vehicles. Use filters to narrow down your perfect match.</p>
+                    </div>
+                </div>
+                <div class="col-md-4">
+                    <div class="card p-4 h-100">
+                        <i class="bi bi-journal-check fs-1 text-primary mb-3"></i>
+                        <h3>2. Book a Test Drive</h3>
+                        <p>Schedule a test drive online. We'll confirm your appointment and prepare the vehicle for you.</p>
+                    </div>
+                </div>
+                <div class="col-md-4">
+                    <div class="card p-4 h-100">
+                        <i class="bi bi-patch-check-fill fs-1 text-primary mb-3"></i>
+                        <h3>3. Secure Your Deal</h3>
+                        <p>Finalize your purchase with our secure payment system and drive away in your new car with confidence.</p>
+                    </div>
+                </div>
+            </div>
+        </div>
     </section>
 
     <?php include 'partials/footer.php'; ?>
 
-    <!-- Scripts -->
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
 </body>
 </html>

login.php

@@ -4,20 +4,21 @@ require_once 'db/config.php';
 session_start();
 
 if (isset($_SESSION['user_id'])) {
-    header("Location: index.php");
+    // Redirect to dashboard if already logged in
+    header("Location: dashboard.php");
     exit();
 }
 
 $errors = [];
 if ($_SERVER['REQUEST_METHOD'] === 'POST') {
-    $email = trim($_POST['email']);
+    $email = trim($_POST['email'] ?? '');
-    $password = $_POST['password'];
+    $password = $_POST['password'] ?? '';
 
-    if (empty($email)) {
+    if (empty($email) || !filter_var($email, FILTER_VALIDATE_EMAIL)) {
-        $errors[] = 'Email is required';
+        $errors[] = 'A valid email is required.';
     }
     if (empty($password)) {
-        $errors[] = 'Password is required';
+        $errors[] = 'Password is required.';
     }
 
     if (empty($errors)) {
@@ -31,13 +32,20 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
                 $_SESSION['user_id'] = $user['id'];
                 $_SESSION['username'] = $user['username'];
                 $_SESSION['role'] = $user['role'];
-                header("Location: index.php");
+                // Redirect to the appropriate dashboard
+                if ($user['role'] === 'admin') {
+                    header("Location: admin/index.php");
+                } else {
+                    header("Location: dashboard.php");
+                }
                 exit();
             } else {
-                $errors[] = 'Invalid email or password';
+                $errors[] = 'Invalid email or password combination.';
             }
         } catch (PDOException $e) {
-            $errors[] = "Database error: " . $e->getMessage();
+            // For security, don't show detailed DB errors in production
+            error_log("Database error: " . $e->getMessage());
+            $errors[] = "An internal error occurred. Please try again later.";
         }
     }
 }
@@ -48,46 +56,50 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Login - Car Sells in Afghanistan</title>
-    <link href="https://rsms.me/inter/inter.css" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
     <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
 </head>
-<body class="bg-slate-50 dark:bg-slate-900 text-slate-800 dark:text-slate-200">
+<body>
-
+    <div class="form-container">
-    <?php include 'partials/navbar.php'; ?>
+        <div class="card auth-card">
-
+            <div class="card-body">
-    <main class="container mx-auto px-4 py-8">
+                <div class="text-center mb-5">
-        <div class="max-w-md mx-auto bg-white dark:bg-slate-800 rounded-lg shadow-md p-8">
+                    <h1 class="h2">Welcome Back!</h1>
-            <h1 class="text-2xl font-bold text-center mb-6">Login to Your Account</h1>
+                    <p class="text-muted">Login to access your account and explore the best cars in Afghanistan.</p>
+                </div>
                 
                 <?php if (!empty($errors)): ?>
-                <div class="bg-red-100 dark:bg-red-900 border border-red-400 text-red-700 dark:text-red-200 px-4 py-3 rounded relative mb-4" role="alert">
+                    <div class="alert alert-danger" role="alert">
-                    <ul>
                         <?php foreach ($errors as $error): ?>
-                            <li><?php echo htmlspecialchars($error); ?></li>
+                            <p class="mb-0"><?php echo htmlspecialchars($error); ?></p>
                         <?php endforeach; ?>
-                    </ul>
                     </div>
                 <?php endif; ?>
 
                 <form action="login.php" method="POST">
                     <div class="mb-4">
-                    <label for="email" class="block text-sm font-medium mb-2">Email Address</label>
+                        <label for="email" class="form-label">Email address</label>
-                    <input type="email" id="email" name="email" class="w-full px-3 py-2 bg-slate-100 dark:bg-slate-700 rounded-md focus:outline-none focus:ring-2 focus:ring-orange-500" required>
+                        <input type="email" id="email" name="email" class="form-control" placeholder="you@example.com" required value="<?php echo isset($email) ? htmlspecialchars($email) : ''; ?>">
                     </div>
-                <div class="mb-6">
+                    <div class="mb-4">
-                    <label for="password" class="block text-sm font-medium mb-2">Password</label>
+                        <label for="password" class="form-label">Password</label>
-                    <input type="password" id="password" name="password" class="w-full px-3 py-2 bg-slate-100 dark:bg-slate-700 rounded-md focus:outline-none focus:ring-2 focus:ring-orange-500" required>
+                        <input type="password" id="password" name="password" class="form-control" placeholder="••••••••" required>
+                    </div>
+                    <div class="d-grid mt-5">
+                        <button type="submit" class="btn btn-primary">Login</button>
                     </div>
-                <button type="submit" class="w-full bg-orange-600 hover:bg-orange-700 text-white font-bold py-2 px-4 rounded-md transition duration-300">Login</button>
                 </form>
-            <p class="text-center text-sm mt-6">
+
-                Don't have an account? <a href="register.php" class="text-orange-500 hover:underline">Register here</a>.
+                <p class="text-center text-muted mt-4">
+                    Don't have an account? <a href="register.php">Create one now</a>.
+                </p>
+                 <p class="text-center text-muted mt-2">
+                    <a href="index.php">Back to Home</a>
                 </p>
             </div>
-    </main>
+        </div>
+    </div>
 
-    <?php include 'partials/footer.php'; ?>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
-
-    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
 </body>
 </html>

partials/footer.php

@@ -1,13 +1,40 @@
-<footer class="footer text-center">
+<footer class="footer">
     <div class="container">
-        <div class="row justify-content-center mb-4">
+        <div class="row g-4">
-            <div class="col-md-6">
+            <div class="col-lg-4 mb-4 mb-lg-0">
-                <h5 class="fw-bold mb-3">Car Sells AF</h5>
+                <h4 class="h5">CarBazaar</h4>
-                <p class="text-muted small">The easiest way to buy and sell cars in Afghanistan. Secure, fast, and reliable.</p>
+                <p class="text-white-50">Your trusted partner in buying and selling quality cars in Afghanistan. We are committed to transparency and customer satisfaction.</p>
+            </div>
+            <div class="col-lg-2 col-md-4 col-6">
+                <h5 class="h6">Quick Links</h5>
+                <ul class="list-unstyled">
+                    <li class="mb-2"><a href="index.php">Home</a></li>
+                    <li class="mb-2"><a href="car_list.php">All Cars</a></li>
+                    <li class="mb-2"><a href="login.php">Login</a></li>
+                    <li class="mb-2"><a href="register.php">Register</a></li>
+                </ul>
+            </div>
+            <div class="col-lg-3 col-md-4 col-6">
+                <h5 class="h6">Contact Us</h5>
+                <ul class="list-unstyled text-white-50">
+                    <li class="mb-2"><i class="bi bi-geo-alt-fill me-2"></i>Kabul, Afghanistan</li>
+                    <li class="mb-2"><i class="bi bi-telephone-fill me-2"></i>+93 700 000 000</li>
+                    <li class="mb-2"><i class="bi bi-envelope-fill me-2"></i>contact@carbazaar.af</li>
+                </ul>
+            </div>
+            <div class="col-lg-3 col-md-4">
+                <h5 class="h6">Follow Us</h5>
+                <p class="text-white-50">Stay updated with our latest additions and offers.</p>
+                <div class="d-flex gap-3">
+                    <a href="#" class="fs-4"><i class="bi bi-facebook"></i></a>
+                    <a href="#" class="fs-4"><i class="bi bi-twitter-x"></i></a>
+                    <a href="#" class="fs-4"><i class="bi bi-instagram"></i></a>
                 </div>
             </div>
-        <div class="border-top pt-4">
+        </div>
-            <p class="text-muted small mb-0">&copy; <?php echo date('Y'); ?> Car Sells in Afghanistan. All rights reserved.</p>
+        <hr class="my-4 border-secondary">
+        <div class="text-center text-white-50">
+            <p>&copy; <?php echo date('Y'); ?> CarBazaar Afghanistan. All Rights Reserved.</p>
         </div>
     </div>
 </footer>

partials/navbar.php

@@ -2,49 +2,45 @@
 if (session_status() === PHP_SESSION_NONE) {
     session_start();
 }
+$current_page = basename($_SERVER['PHP_SELF']);
 ?>
 <nav class="navbar navbar-expand-lg sticky-top">
     <div class="container">
-        <a class="navbar-brand" href="index.php">
+        <a class="navbar-brand" href="index.php">CarBazaar</a>
-            <i class="bi bi-car-front-fill text-primary me-2"></i>Car Sells AF
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
-        </a>
-        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarNav">
             <ul class="navbar-nav ms-auto align-items-center">
-                <li class="nav-item"><a class="nav-link" href="index.php">Home</a></li>
+                <li class="nav-item">
-                <li class="nav-item"><a class="nav-link" href="car_list.php">Cars</a></li>
+                    <a class="nav-link <?= ($current_page == 'index.php') ? 'active' : '' ?>" href="index.php">Home</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link <?= ($current_page == 'car_list.php') ? 'active' : '' ?>" href="car_list.php">All Cars</a>
+                </li>
                 
                 <?php if (isset($_SESSION['user_id'])): ?>
-                    <li class="nav-item"><a class="nav-link" href="#">Sell Your Car</a></li>
                     <li class="nav-item dropdown">
                         <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
-                            <i class="bi bi-person-circle"></i> <?php echo htmlspecialchars($_SESSION['username']); ?>
+                           <img src="https://i.pravatar.cc/30?u=<?= htmlspecialchars($_SESSION['username']) ?>" alt="" class="rounded-circle me-2"><?= htmlspecialchars($_SESSION['username']); ?>
                         </a>
                         <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdown">
-                            <li><a class="dropdown-item" href="dashboard.php">Dashboard</a></li>
+                            <li><a class="dropdown-item" href="dashboard.php">My Dashboard</a></li>
                             <?php if ($_SESSION['role'] === 'admin'): ?>
                                 <li><a class="dropdown-item" href="admin/index.php">Admin Panel</a></li>
                             <?php endif; ?>
                             <li><hr class="dropdown-divider"></li>
-                            <li><a class="dropdown-item" href="logout.php">Logout</a></li>
+                            <li><a class="dropdown-item text-danger" href="logout.php">Logout</a></li>
                         </ul>
                     </li>
                 <?php else: ?>
                     <li class="nav-item ms-lg-3">
-                        <a href="login.php" class="btn btn-primary btn-sm rounded-pill px-4">Login</a>
+                        <a href="login.php" class="btn btn-secondary">Login</a>
                     </li>
                      <li class="nav-item ms-2">
-                        <a href="register.php" class="btn btn-outline-secondary btn-sm rounded-pill px-4">Register</a>
+                        <a href="register.php" class="btn btn-primary">Register</a>
                     </li>
                 <?php endif; ?>
-
-                <li class="nav-item ms-3">
-                    <button id="theme-toggle" class="btn btn-link text-muted p-0 border-0">
-                        <i class="bi bi-moon-fill fs-5"></i>
-                    </button>
-                </li>
             </ul>
         </div>
     </div>

register.php

@@ -4,106 +4,116 @@ require_once 'db/config.php';
 session_start();
 
 if (isset($_SESSION['user_id'])) {
-    header("Location: index.php");
+    header("Location: dashboard.php");
     exit();
 }
 
 $errors = [];
 if ($_SERVER['REQUEST_METHOD'] === 'POST') {
-    $username = trim($_POST['username']);
+    $username = trim($_POST['username'] ?? '');
-    $email = trim($_POST['email']);
+    $email = trim($_POST['email'] ?? '');
-    $password = $_POST['password'];
+    $password = $_POST['password'] ?? '';
 
+    // Validation
     if (empty($username)) {
-        $errors[] = 'Username is required';
+        $errors[] = 'Username is required.';
     }
-    if (empty($email)) {
+    if (empty($email) || !filter_var($email, FILTER_VALIDATE_EMAIL)) {
-        $errors[] = 'Email is required';
+        $errors[] = 'A valid email is required.';
-    } else if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
-        $errors[] = 'Invalid email format';
     }
     if (empty($password)) {
-        $errors[] = 'Password is required';
+        $errors[] = 'Password is required.';
+    } elseif (strlen($password) < 8) {
+        $errors[] = 'Password must be at least 8 characters long.';
     }
 
     if (empty($errors)) {
         try {
             $pdo = db();
+            // Check if username or email already exists
             $stmt = $pdo->prepare("SELECT COUNT(*) FROM users WHERE email = :email OR username = :username");
             $stmt->execute(['email' => $email, 'username' => $username]);
             if ($stmt->fetchColumn() > 0) {
-                $errors[] = 'Username or email already exists';
+                $errors[] = 'Username or email is already taken.';
             } else {
+                // Hash password and insert new user
                 $password_hash = password_hash($password, PASSWORD_DEFAULT);
-                $insert_stmt = $pdo->prepare("INSERT INTO users (username, email, password_hash) VALUES (:username, :email, :password_hash)");
+                $insert_stmt = $pdo->prepare("INSERT INTO users (username, email, password_hash, role) VALUES (:username, :email, :password_hash, 'user')");
                 $insert_stmt->execute([
                     ':username' => $username,
                     ':email' => $email,
                     ':password_hash' => $password_hash
                 ]);
+                
+                // Log the user in immediately
                 $_SESSION['user_id'] = $pdo->lastInsertId();
                 $_SESSION['username'] = $username;
                 $_SESSION['role'] = 'user';
-                header("Location: index.php");
+                
+                header("Location: dashboard.php");
                 exit();
             }
         } catch (PDOException $e) {
-            $errors[] = "Database error: " . $e->getMessage();
+            error_log("Database error: " . $e->getMessage());
+            $errors[] = 'An internal error occurred. Please try again later.';
         }
     }
 }
-
 ?>
 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Register - Car Sells in Afghanistan</title>
+    <title>Create Account - Car Sells in Afghanistan</title>
-    <link href="https://rsms.me/inter/inter.css" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
     <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
 </head>
-<body class="bg-slate-50 dark:bg-slate-900 text-slate-800 dark:text-slate-200">
+<body>
-
+    <div class="form-container">
-    <?php include 'partials/navbar.php'; ?>
+        <div class="card auth-card">
-
+            <div class="card-body">
-    <main class="container mx-auto px-4 py-8">
+                <div class="text-center mb-5">
-        <div class="max-w-md mx-auto bg-white dark:bg-slate-800 rounded-lg shadow-md p-8">
+                    <h1 class="h2">Create Your Account</h1>
-            <h1 class="text-2xl font-bold text-center mb-6">Create an Account</h1>
+                    <p class="text-muted">Join us to find your dream car in Afghanistan.</p>
+                </div>
 
                 <?php if (!empty($errors)): ?>
-                <div class="bg-red-100 dark:bg-red-900 border border-red-400 text-red-700 dark:text-red-200 px-4 py-3 rounded relative mb-4" role="alert">
+                    <div class="alert alert-danger" role="alert">
-                    <ul>
                         <?php foreach ($errors as $error): ?>
-                            <li><?php echo htmlspecialchars($error); ?></li>
+                            <p class="mb-0"><?php echo htmlspecialchars($error); ?></p>
                         <?php endforeach; ?>
-                    </ul>
                     </div>
                 <?php endif; ?>
 
                 <form action="register.php" method="POST">
-                <div class="mb-4">
+                    <div class="mb-3">
-                    <label for="username" class="block text-sm font-medium mb-2">Username</label>
+                        <label for="username" class="form-label">Username</label>
-                    <input type="text" id="username" name="username" class="w-full px-3 py-2 bg-slate-100 dark:bg-slate-700 rounded-md focus:outline-none focus:ring-2 focus:ring-orange-500" required>
+                        <input type="text" id="username" name="username" class="form-control" placeholder="e.g., ahmadwali" required value="<?php echo isset($username) ? htmlspecialchars($username) : ''; ?>">
                     </div>
-                <div class="mb-4">
+                    <div class="mb-3">
-                    <label for="email" class="block text-sm font-medium mb-2">Email Address</label>
+                        <label for="email" class="form-label">Email address</label>
-                    <input type="email" id="email" name="email" class="w-full px-3 py-2 bg-slate-100 dark:bg-slate-700 rounded-md focus:outline-none focus:ring-2 focus:ring-orange-500" required>
+                        <input type="email" id="email" name="email" class="form-control" placeholder="you@example.com" required value="<?php echo isset($email) ? htmlspecialchars($email) : ''; ?>">
                     </div>
-                <div class="mb-6">
+                    <div class="mb-3">
-                    <label for="password" class="block text-sm font-medium mb-2">Password</label>
+                        <label for="password" class="form-label">Password</label>
-                    <input type="password" id="password" name="password" class="w-full px-3 py-2 bg-slate-100 dark:bg-slate-700 rounded-md focus:outline-none focus:ring-2 focus:ring-orange-500" required>
+                        <input type="password" id="password" name="password" class="form-control" placeholder="Minimum 8 characters" required>
+                    </div>
+                    <div class="d-grid mt-4">
+                        <button type="submit" class="btn btn-primary">Create Account</button>
                     </div>
-                <button type="submit" class="w-full bg-orange-600 hover:bg-orange-700 text-white font-bold py-2 px-4 rounded-md transition duration-300">Register</button>
                 </form>
-            <p class="text-center text-sm mt-6">
+
-                Already have an account? <a href="login.php" class="text-orange-500 hover:underline">Login here</a>.
+                <p class="text-center text-muted mt-4">
+                    Already have an account? <a href="login.php">Login here</a>.
+                </p>
+                 <p class="text-center text-muted mt-2">
+                    <a href="index.php">Back to Home</a>
                 </p>
             </div>
-    </main>
+        </div>
+    </div>
 
-    <?php include 'partials/footer.php'; ?>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
-
-    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
 </body>
 </html>