<div class="page-contact-us">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-4">
                <!-- Contact Us Content Start -->
                <div class="contact-us-content">
                    <!-- Section Title Start -->
                    <div class="section-title section-title-center">
                        <h3 class="wow fadeInUp">contact form</h3>
                        <h2 class="text-anime-style-2" data-cursor="-opaque">Get in to <span>touch</span></h2>
                    </div>
                    <!-- Section Title End -->

                    <!-- Contact Info List Start -->
                    <div class="contact-info-list">
                        <!-- Contact Info Item Start -->
                        <div class="contact-info-item wow fadeInUp" data-wow-delay="0.2s">
                            <div class="icon-box">
                                <img src="{{ asset('../website/images/icon-phone.svg') }}" alt="">
                            </div>
                            <div class="contact-info-content">
                                <p>call to question</p>
                                <h3><a href="tel:+{{ $commonWebData['phone_no'] }}">+{{ $commonWebData['phone_no'] }}</a></h3>
                            </div>
                        </div>
                        <!-- Contact Info Item End -->

                        <!-- Contact Info Item Start -->
                        <div class="contact-info-item wow fadeInUp" data-wow-delay="0.4s">
                            <div class="icon-box">
                                <img src="{{ asset('../website/images/icon-mail.svg') }}" alt="">
                            </div>
                            <div class="contact-info-content">
                                <p>send e-mail</p>
                                <h3><a href="mailto:{{ $commonWebData['email'] }}">{{ $commonWebData['email'] }}</a></h3>
                            </div>
                        </div>
                        <!-- Contact Info Item End -->

                        <!-- Contact Info Item Start -->
                        <div class="contact-info-item wow fadeInUp" data-wow-delay="0.6s">
                            <div class="icon-box">
                                <img src="{{ asset('../website/images/icon-location.svg') }}" alt="">
                            </div>
                            <div class="contact-info-content">
                                <p>visit anytime</p>
                                <h3>{{ $commonWebData['address'] }}</h3>
                            </div>
                        </div>
                        <!-- Contact Info Item End -->
                    </div>
                    <!-- Contact Info List End -->
                </div>
                <!-- Contact Us Content End -->
            </div>

            <div class="col-lg-8">
                <!-- Contact Us Form Start -->
                <div class="contact-us-form">
                    <!-- Section Title Start -->
                    <div class="section-title">
                        <h2 class="text-anime-style-2" data-cursor="-opaque">Send message <span>to us</span></h2>
                    </div>
                    <!-- Section Title End -->

                    <!-- Contact Form Start -->
                    <div class="contact-form">
                        <form action="{{ route('send-contact-message') }}" method="POST" enctype="multipart/form-data" data-toggle="validator" class="wow fadeInUp" data-wow-delay="0.2s">

                            {{ method_field('POST') }}
                            {{ csrf_field() }}
                            <div class="row">
                                <div class="form-group col-md-6 mb-4">
                                    <input type="text" name="first_name" class="form-control" id="fname" placeholder="First Name" required>
                                    <i class="fa-regular fa-user"></i>
                                    <div class="help-block with-errors"></div>
                                </div>

                                <div class="form-group col-md-6 mb-4">
                                    <input type="text" name="last_name" class="form-control" id="lname" placeholder="Last Name" required>
                                    <i class="fa-regular fa-user"></i>
                                    <div class="help-block with-errors"></div>
                                </div>

                                <div class="form-group col-md-6 mb-4">
                                    <input type="email" name="email" class="form-control" id="email" placeholder="Email Address" required>
                                    <i class="fa-regular fa-envelope"></i>
                                    <div class="help-block with-errors"></div>
                                </div>

                                <div class="form-group col-md-6 mb-4">
                                    <input type="text" name="phone" class="form-control" id="phone" placeholder="Phone Number" required>
                                    <img src="{{ asset('../website/images/icon-phone-primary.svg') }}" alt="">
                                    <div class="help-block with-errors"></div>
                                </div>

                                <div class="form-group col-md-12 mb-5">
                                    <textarea name="description" class="form-control" id="message" rows="4" placeholder="Message"></textarea>
                                    <div class="help-block with-errors"></div>
                                </div>

                                <div class="col-lg-12">
                                    <div class="contact-form-btn">
                                        <button type="submit" class="btn-default">submit message</button>
                                        <div id="msgSubmit" class="h3 hidden"></div>
                                    </div>
                                </div>

                                @include('flash-message')
                            </div>
                        </form>
                    </div>
                    <!-- Contact Form End -->
                </div>
                <!-- Contact Us Form End -->
            </div>
        </div>
    </div>
</div>