<?php include 'includes/header.php'; ?>

<section class="hero" style="background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('images/contact_bg.jpg') no-repeat center center/cover; height: 60vh;">
    <div class="hero-content">
        <h1>Contact Us</h1>
        <p>We are here to help you 24/7</p>
    </div>
</section>

<section class="section container">
    <div class="row g-5 mt-4">
        <!-- Contact Info -->
        <div class="col-lg-5">
            <h2 class="mb-4">Get in Touch</h2>
            <p class="text-muted">Have a question or need assistance with your booking? Our friendly customer service team is ready to help.</p>
            
            <div class="mt-4">
                <div class="d-flex align-items-start mb-4">
                    <i class="fas fa-map-marker-alt mt-1 me-3 fs-3 text-primary"></i>
                    <div>
                        <h3 class="h5">Address</h3>
                        <p class="text-muted mb-0">100 Broadway, New York, NY 10005, USA</p>
                    </div>
                </div>
                
                <div class="d-flex align-items-start mb-4">
                    <i class="fas fa-phone-alt mt-1 me-3 fs-3 text-primary"></i>
                    <div>
                        <h3 class="h5">Phone</h3>
                        <p class="mb-1"><a href="tel:+18553500136" class="fw-bold text-decoration-none text-warning">+1 (855) 350-0136</a></p>
                        <p class="text-muted mb-0">Available 24/7 for car rental bookings and changes.</p>
                    </div>
                </div>

                <div class="d-flex align-items-start mb-4">
                    <i class="fas fa-envelope mt-1 me-3 fs-3 text-primary"></i>
                    <div>
                        <h3 class="h5">Email</h3>
                        <p class="mb-1"><a href="mailto:info@tripstaker.com" class="text-decoration-none">info@tripstaker.com</a></p>
                        <p class="text-muted mb-0">We aim to respond to all emails within 24 hours.</p>
                    </div>
                </div>
            </div>
        </div>

        <!-- Contact Form -->
        <div class="col-lg-7">
            <div class="bg-white p-4 p-md-5 rounded shadow-sm border">
                <h2 class="mb-4">Send a Message</h2>
                <form action="submit_lead.php" method="POST">
                    <input type="hidden" name="trip_type" value="Contact Request">
                    <input type="hidden" name="origin" value="N/A">
                    <input type="hidden" name="destination" value="N/A">
                    <input type="hidden" name="departure_date" value="<?php echo date('Y-m-d'); ?>">
                    <input type="hidden" name="passengers" value="1">
                    
                    <div class="mb-3">
                        <label class="form-label">Name <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" name="customer_name" required>
                    </div>

                    <div class="mb-3">
                        <label class="form-label">Phone Number <span class="text-danger">*</span></label>
                        <input type="tel" class="form-control" name="phone_number" required>
                    </div>

                    <div class="mb-3">
                        <label class="form-label">Email <span class="text-danger">*</span></label>
                        <input type="email" class="form-control" name="email" required>
                    </div>

                    <div class="mb-4">
                        <label class="form-label">Message <span class="text-danger">*</span></label>
                        <textarea class="form-control" name="message" rows="5" required></textarea>
                    </div>

                    <button type="submit" class="btn btn-primary w-100 py-2 fw-bold">Send Message</button>
                </form>
            </div>
        </div>
    </div>
</section>

<!-- Embedded Google Map -->
<section class="map" style="height: 400px; width: 100%;">
    <iframe 
        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d193595.15830869428!2d-74.11976295554611!3d40.69766374874431!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew%20York%2C%20NY!5e0!3m2!1sen!2sus!4v1647891234567!5m2!1sen!2sus" 
        width="100%" 
        height="100%" 
        style="border:0;" 
        allowfullscreen="" 
        loading="lazy">
    </iframe>
</section>

<?php include 'includes/footer.php'; ?>
