{{-- resources/views/front/home.blade.php --}}
@extends('front.layouts.mainLayout')

@section('content')
    <main class="contact">
        <section class="contact-banner"
            style="background-image: url('{{ asset('front/images/contactBanner.jpg') }}')">
            <div class="containerBennerContent">
                <h1 class="contact-title">CONTACT US</h1>
                <div class="content">
                    <p>
                        Whether you have a question about our projects, partnership
                        opportunities, or simply want to connect—our team is here to
                        help. </p>


                </div>
            </div>
        </section>
        <section class="contact-section ">

            <h2 class="section-title">Send Us a Message</h2>
            <span></span>
            <p>We’d love to hear from you. Please fill out the form below and a member of our
                team will be in touch shortly</p>
            <div class="form-wrapper">
                <form class="contact-form" method="POST" action="{{ route('contact-request.store') }}" data-aos="fade-up" data-aos-delay="200">
                    @csrf
                    <div class="form-row">
                        <input type="text" name="name" placeholder="NAME" value="{{ old('name') }}" required>
                        <input type="email" name="email" placeholder="EMAIL" value="{{ old('email') }}" required>
                    </div>

                    <div class="form-row">
                        <input type="tel" name="phone" placeholder="MOBILE" value="{{ old('phone') }}" required>
                        <select name="product_id" required>
                            <option disabled selected hidden>SELECT A PROJECT</option>
                            @foreach ($products as $id => $title)
                                <option value="{{ $id }}" {{ old('product_id') == $id ? 'selected' : '' }}>{{ $title }}</option>
                            @endforeach
                        </select>
                    </div>

                    <textarea name="message" placeholder="MESSAGE" style="font-family: 'OverusedGrotesk', sans-serif;" required>{{ old('message') }}</textarea>

                    <button type="submit">SUBMIT</button>
                </form>

            </div>
        </section>
        <section class="map-section" data-aos="fade-up" data-aos-delay="200">
            <h2 class="map-title">Find Us on the Map</h2>
            <div class="map-container">
                <iframe
                    src="{{ $contactInfo->maps }}"
                    width="100%"
                    height="100%"
                    style="border:0;"
                    allowfullscreen
                    loading="lazy"
                    referrerpolicy="no-referrer-when-downgrade">
                </iframe>
            </div>
        </section>




    </main>
@endsection