@extends('front.layout.app')
@section('title', 'Contact Us')
@section('content')
    <section class="inner-banner">
        <img src="{{ $data->cmsImages('banner_image') ?? '' }}" alt="front/images" class="img-fluid w-100 h-100">
        <div class="container">
            <div class="inner-banner__content">
                <h1> {{ $data->content['banner_heading'] ?? '' }} </h1>
            </div>
        </div>
    </section>

    <section class="contact-section padd-y">
        <div class="container">
            <div class="row">
                <div class="col-lg-5">
                    <div class="contact-info">
                        <h3 class="secHeading mb-4" data-aos="fade-up">{{ $data->content['cont_info_heading'] ?? '' }}</h3>
                        <ul>
                            <li data-aos="fade-up">
                                <a href="">
                                    <span><i class="fas fa-map-marker-alt"></i></span>
                                    <p>
                                        <strong>Main store:</strong> 1192 Bear Christiana Rd #2224
                                        Bear, DE 19701
                                    </p>
                                </a>
                            </li>
                            <li data-aos="fade-up">
                                <a href="mailto:{{ $setting->email ?? '' }}">
                                    <span><i class="fas fa-envelope"></i></span>
                                    <p>
                                        <strong>Email:</strong> {{ $setting->email ?? '' }}
                                    </p>
                                </a>
                            </li>
                            <li data-aos="fade-up">
                                <a href="tel:2403583046">
                                    <span><i class="fas fa-phone-alt"></i></span>
                                    <p>
                                        <strong>Phone Number:</strong> (240) 358 3046
                                    </p>
                                </a>
                            </li>
                        </ul>
                        <ul class="social-icon" data-aos="fade-up">
                            <li><a href="https://www.instagram.com/luxurycandles_llc/profilecard/?igsh=MjlpcmIzeGhrOTB6"
                                    target="_blank"><i class="fab fa-instagram"></i></a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-lg-6">
                    <form class="contactForm" data-aos="zoom-in" method="post"
                        action="{{ route('front.contact.submit') }}">
                        @csrf
                        <h3 class="secHeading mb-4">{{ $data->content['con_form_heading'] ?? '' }}</h3>
                        <div class="row">
                            <div class="col-md-6">
                                <input type="text" placeholder="First Name*" name="first_name" required>
                                @error('first_name')
                                    <span>{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="col-md-6">
                                <input type="text" placeholder="Last Name*" name="last_name" required>
                                @error('last_name')
                                    <span>{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="col-md-12">
                                <input type="email" placeholder="Your Email*" name="email" required>
                                @error('email')
                                    <span>{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="col-12">
                                <select>
                                    <option value="Products">Products</option>
                                    <option value="Products">Products</option>
                                    <option value="Products">Products</option>
                                </select>
                            </div>
                            <div class="col-12">
                                <textarea rows="5" placeholder="Message" name="message"></textarea>
                                @error('email')
                                    <span>{{ $message }}</span>
                                @enderror
                            </div>
                            <div class="col-12">
                                <button type="submit" class="themeBtn ">{{ $data->content['con_form_btn'] ?? '' }}</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section>

    <section class="map-section" data-aos="fade-up">
        <iframe
            src="{{ $data->content['con_map_link'] ?? '' }}"
            width="100%" height="650" style="border:0;" allowfullscreen=""
            referrerpolicy="no-referrer-when-downgrade"></iframe>
    </section>
@endsection