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

$success = false;
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $name = $_POST['name'] ?? '';
    $email = $_POST['email'] ?? '';
    $subject = $_POST['subject'] ?? '';
    $message = $_POST['message'] ?? '';
    
    $pdo = db();
    $stmt = $pdo->prepare("INSERT INTO contact_messages (name, email, subject, message) VALUES (?, ?, ?, ?)");
    if ($stmt->execute([$name, $email, $subject, $message])) {
        $success = true;
    }
}
?>

<section class="hero" style="height: 40vh; background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('assets/images/contact-hero.jpg') center/cover no-repeat;">
    <h1>Get in Touch</h1>
    <p>Have questions? Our team is here to help you find the perfect vehicle.</p>
</section>

<div class="container" style="max-width: 1200px; margin-top: -5rem;">
    <div style="display: grid; grid-template-columns: 1fr 2fr; gap: 3rem;">
        <div style="display: flex; flex-direction: column; gap: 2rem;">
            <div class="glass" style="padding: 2.5rem; border-left: 4px solid var(--primary-color);">
                <h3 style="color: var(--primary-color); margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.8rem;">
                    <span>📍</span> Visit Us
                </h3>
                <p style="font-size: 1rem; color: var(--text-secondary); line-height: 1.8;">
                    Wazir Akbar Khan, District 10,<br>
                    Kabul, Afghanistan
                </p>
                <p style="margin-top: 1.5rem; font-weight: 700; font-size: 1.2rem;">+93 799 123 456</p>
            </div>
            
            <div class="glass" style="padding: 2.5rem; border-left: 4px solid var(--primary-color);">
                <h3 style="color: var(--primary-color); margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.8rem;">
                    <span>🕒</span> Working Hours
                </h3>
                <div style="display: flex; justify-content: space-between; margin-bottom: 0.8rem;">
                    <span style="color: var(--text-secondary);">Sat - Wed:</span>
                    <span style="font-weight: 600;">8:00 - 18:00</span>
                </div>
                <div style="display: flex; justify-content: space-between;">
                    <span style="color: var(--text-secondary);">Thursday:</span>
                    <span style="font-weight: 600;">8:00 - 13:00</span>
                </div>
            </div>

            <div class="glass" style="padding: 2.5rem; border-left: 4px solid var(--primary-color);">
                <h3 style="color: var(--primary-color); margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.8rem;">
                    <span>✉️</span> Support Email
                </h3>
                <p style="font-size: 1rem; color: var(--text-secondary);">info@afgcars.af</p>
                <p style="font-size: 1rem; color: var(--text-secondary);">support@afgcars.af</p>
            </div>
        </div>

        <div class="glass" style="padding: 4rem;">
            <h2 style="margin-bottom: 2rem; font-size: 2rem;">Send us a message</h2>
            <?php if ($success): ?>
                <div class="alert alert-success" style="margin-bottom: 3rem;">
                    ✨ Message sent successfully! Our representative will contact you within 24 hours.
                </div>
            <?php endif; ?>
            
            <form method="POST">
                <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 2rem;">
                    <div class="form-group">
                        <label>Your Name</label>
                        <input type="text" name="name" class="form-control" required placeholder="John Doe">
                    </div>
                    <div class="form-group">
                        <label>Email Address</label>
                        <input type="email" name="email" class="form-control" required placeholder="john@example.com">
                    </div>
                </div>
                <div class="form-group">
                    <label>Subject</label>
                    <input type="text" name="subject" class="form-control" required placeholder="Inquiry about Toyota Land Cruiser">
                </div>
                <div class="form-group">
                    <label>How can we help?</label>
                    <textarea name="message" class="form-control" rows="6" required placeholder="Write your message here..."></textarea>
                </div>
                <button type="submit" class="btn btn-primary" style="width: 100%; padding: 1.2rem; font-size: 1.1rem;">Send Message</button>
            </form>
        </div>
    </div>
</div>

<div class="container" style="margin-top: 4rem;">
    <div class="glass" style="height: 450px; width: 100%; position: relative; overflow: hidden;">
        <!-- Map Placeholder -->
        <div style="position: absolute; inset: 0; background: url('assets/images/contact-map.jpg') center/cover; filter: grayscale(1) contrast(1.2) brightness(0.5);"></div>
        <div style="position: relative; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; background: rgba(0,0,0,0.4);">
            <div style="font-size: 4rem; margin-bottom: 1rem;">📍</div>
            <h2 style="font-size: 2.5rem; text-transform: uppercase; letter-spacing: 3px;">Our Location</h2>
            <p style="color: var(--primary-color); font-weight: 700;">VISIT US IN KABUL</p>
            <a href="https://maps.google.com" target="_blank" class="btn btn-outline" style="margin-top: 2rem;">Open in Google Maps</a>
        </div>
    </div>
</div>

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