<?php
require_once __DIR__ . '/includes/header.php';

$pdo = db();
$id = $_GET['id'] ?? 0;

$stmt = $pdo->prepare("
    SELECT c.*, u.name as seller_name, ci.image_path 
    FROM cars c 
    JOIN users u ON c.user_id = u.id 
    LEFT JOIN car_images ci ON c.id = ci.car_id AND ci.is_main = 1 
    WHERE c.id = ? AND c.deleted_at IS NULL AND (c.status = 'approved' OR c.status = 'sold')
");
$stmt->execute([$id]);
$car = $stmt->fetch();

if (!$car) {
    header('Location: cars.php');
    exit;
}

// Fetch all images
$stmt = $pdo->prepare("SELECT image_path FROM car_images WHERE car_id = ?");
$stmt->execute([$id]);
$images = $stmt->fetchAll(PDO::FETCH_COLUMN);
?>

<div class="container" style="padding: 2rem 0;">
    <div style="display: grid; grid-template-columns: 1.5fr 1fr; gap: 4rem; align-items: start;">
        
        <!-- Left Column: Images & Info -->
        <div>
            <div style="position: relative; margin-bottom: 2rem;">
                <img src="<?= htmlspecialchars($car['image_path'] ?: 'assets/images/placeholder-car.jpg') ?>" style="width: 100%; border-radius: 24px; box-shadow: 0 20px 40px rgba(0,0,0,0.1);">
                <?php if ($car['status'] === 'sold'): ?>
                    <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); border-radius: 24px; display: flex; align-items: center; justify-content: center;">
                        <div style="border: 10px double white; color: white; padding: 20px 50px; font-weight: 900; font-size: 5rem; transform: rotate(-15deg); letter-spacing: 10px;">SOLD</div>
                    </div>
                <?php endif; ?>
            </div>

            <div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 3rem;">
                <?php foreach ($images as $img): ?>
                    <img src="<?= htmlspecialchars($img) ?>" style="width: 100%; height: 100px; object-fit: cover; border-radius: 12px; cursor: pointer; transition: transform 0.3s ease;" onmouseover="this.style.transform='scale(1.05)'" onmouseout="this.style.transform='scale(1)'">
                <?php endforeach; ?>
            </div>

            <div class="glass" style="padding: 3rem;">
                <h2 style="font-size: 1.8rem; font-weight: 800; margin-bottom: 1.5rem;">Description</h2>
                <div style="line-height: 1.8; color: var(--text-secondary); white-space: pre-line;">
                    <?= htmlspecialchars($car['description']) ?>
                </div>
            </div>
        </div>

        <!-- Right Column: Details & Actions -->
        <div style="position: sticky; top: 120px;">
            <div class="glass" style="padding: 3rem; border-top: 5px solid var(--primary-color);">
                <div style="margin-bottom: 2rem;">
                    <span style="background: rgba(212, 175, 55, 0.1); color: var(--primary-color); padding: 0.5rem 1rem; border-radius: 30px; font-size: 0.8rem; font-weight: 800; text-transform: uppercase;"><?= htmlspecialchars($car['city']) ?></span>
                </div>
                
                <h1 style="font-size: 2.5rem; font-weight: 900; margin-bottom: 1rem; line-height: 1.1;">
                    <?= htmlspecialchars($car['brand'] . ' ' . $car['model']) ?>
                </h1>
                
                <p style="font-size: 1.2rem; color: var(--text-secondary); margin-bottom: 2rem;">
                    Year: <strong><?= $car['year'] ?></strong> | Status: <strong><?= ucfirst($car['status']) ?></strong>
                </p>

                <div style="background: rgba(0,0,0,0.03); padding: 2rem; border-radius: 16px; margin-bottom: 2.5rem;">
                    <p style="color: var(--text-secondary); margin-bottom: 0.5rem; font-size: 0.9rem; font-weight: 700; text-transform: uppercase;">Current Price</p>
                    <div style="font-size: 3rem; font-weight: 900; color: var(--primary-color);">$<?= number_format($car['price']) ?></div>
                </div>

                <?php if ($car['status'] === 'sold'): ?>
                    <div style="padding: 2rem; background: rgba(0,0,0,0.05); border-radius: 16px; text-align: center; color: var(--text-secondary); font-weight: 700;">
                        This vehicle has been sold.
                    </div>
                <?php else: ?>
                    <a href="purchase.php?id=<?= $car['id'] ?>" class="btn btn-primary" style="width: 100%; padding: 1.5rem; font-size: 1.2rem; font-weight: 800; margin-bottom: 1.5rem; text-align: center; display: block;">Initiate Purchase Request</a>
                <?php endif; ?>

                <div style="padding-top: 2rem; border-top: 1px solid var(--glass-border);">
                    <div style="display: flex; align-items: center; gap: 1rem;">
                        <div style="width: 50px; height: 50px; background: var(--primary-color); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: 1.2rem;">
                            <?= strtoupper(substr($car['seller_name'], 0, 1)) ?>
                        </div>
                        <div>
                            <p style="color: var(--text-secondary); font-size: 0.8rem; text-transform: uppercase; margin-bottom: 0.2rem;">Seller</p>
                            <p style="font-weight: 700;"><?= htmlspecialchars($car['seller_name']) ?></p>
                        </div>
                    </div>
                </div>
            </div>

            <div class="glass" style="margin-top: 2rem; padding: 2rem; background: rgba(46, 213, 115, 0.05); border-color: rgba(46, 213, 115, 0.2);">
                <h4 style="color: #2ed573; margin-bottom: 0.8rem; display: flex; align-items: center; gap: 0.5rem;">
                    <span>🛡️</span> AfgCars Secure
                </h4>
                <p style="font-size: 0.85rem; color: #666; line-height: 1.6;">
                    Every listing is manually verified by our team. Personal information and bank IDs are encrypted and used only for legal documentation.
                </p>
            </div>
        </div>

    </div>
</div>

<?php require_once __DIR__ . '/includes/footer.php'; ?>