@extends('masterHome')
@section('body')


    @include('../Layouts/navmenu')

    <!-- Page Header Start -->
    <div class="page-header parallaxie">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <!-- Page Header Box Start -->
                    <div class="page-header-box">
                        <h1 class="text-anime-style-2" data-cursor="-opaque">Contact Us</h1>
                        <nav class="wow fadeInUp">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="index.html">home</a></li>
                                <li class="breadcrumb-item active" aria-current="page">contact us</li>
                            </ol>
                        </nav>
                    </div>
                    <!-- Page Header Box End -->
                </div>
            </div>
        </div>
    </div>
    <!-- Page Header End -->

    <!-- Page contact Us Start -->
    <div class="page-contact-us">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-5">
                    <!-- Contact Info Start -->
                    <div class="contact-info">
                        <div class="contact-info-box wow fadeInUp">
                            <!-- Contact Info Title Start -->
                            <div class="contact-info-title">
                                <h2>chat with us</h2>
                                <p>Speak to our friendly team via live chat.</p>
                            </div>
                            <!-- Contact Info Title End -->

                            <!-- Contact Info Item Start -->
                            <div class="contact-info-item">
                                <a href="#">
                                    <!-- Icon Box Start -->
                                    <div class="icon-box">
                                        <img src="images/icon-chat.svg" alt="">
                                    </div>
                                    <!-- Icon Box End -->

                                    <!-- Contact Info Content Start -->
                                    <div class="contact-info-content">
                                        <p>start a live chat</p>
                                    </div>
                                    <!-- Contact Info Content End -->
                                </a>
                            </div>
                            <!-- Contact Info Item End -->

                            <!-- Contact Info Item Start -->
                            <div class="contact-info-item">
                                <a href="#">
                                    <!-- Icon Box Start -->
                                    <div class="icon-box">
                                        <img src="images/icon-mail.svg" alt="">
                                    </div>
                                    <!-- Icon Box End -->

                                    <!-- Contact Info Content Start -->
                                    <div class="contact-info-content">
                                        <p>shoot us an email</p>
                                    </div>
                                    <!-- Contact Info Content End -->
                                </a>
                            </div>
                            <!-- Contact Info Item End -->

                            <!-- Contact Info Item Start -->
                            <div class="contact-info-item">
                                <a href="#">
                                    <!-- Icon Box Start -->
                                    <div class="icon-box">
                                        <img src="images/icon-twiiter.svg" alt="">
                                    </div>
                                    <!-- Icon Box End -->

                                    <!-- Contact Info Content Start -->
                                    <div class="contact-info-content">
                                        <p>message us on X</p>
                                    </div>
                                    <!-- Contact Info Content End -->
                                </a>
                            </div>
                            <!-- Contact Info Item End -->

                        </div>

                        <div class="contact-info-box wow fadeInUp" data-wow-delay="0.25s">
                            <!-- Contact Info Title Start -->
                            <div class="contact-info-title">
                                <h2>call us</h2>
                                <p>Call our team Mon-Fri from 8am to 5pm.</p>
                            </div>
                            <!-- Contact Info Title End -->

                            <!-- Contact Info Item Start -->
                            <div class="contact-info-item">
                                <a href="#">
                                    <!-- Icon Box Start -->
                                    <div class="icon-box">
                                        <img src="images/icon-phone.svg" alt="">
                                    </div>
                                    <!-- Icon Box End -->

                                    <!-- Contact Info Content Start -->
                                    <div class="contact-info-content">
                                        <p>+91 994 343 0343</p>
                                    </div>
                                    <!-- Contact Info Content End -->
                                </a>
                            </div>
                            <!-- Contact Info Item End -->
                        </div>

                        <div class="contact-info-box wow fadeInUp" data-wow-delay="0.5s">
                            <!-- Contact Info Title Start -->
                            <div class="contact-info-title">
                                <h2>visit us</h2>
                                <p>Chat to us in person at our india HQ.</p>
                            </div>
                            <!-- Contact Info Title End -->

                            <!-- Contact Info Item Start -->
                            <div class="contact-info-item">
                                <a href="#">
                                    <!-- Icon Box Start -->
                                    <div class="icon-box">
                                        <img src="images/icon-location.svg" alt="">
                                    </div>
                                    <!-- Icon Box End -->

                                    <!-- Contact Info Content Start -->
                                    <div class="contact-info-content">
                                        <p>S.g High Way, Ahmedabad - 454545</p>
                                    </div>
                                    <!-- Contact Info Content End -->
                                </a>
                            </div>
                            <!-- Contact Info Item End -->
                        </div>
                    </div>
                    <!-- Contact Info End -->
                </div>
                <div class="col-lg-7">

                    <div class="contact-us-content">
                        <!-- Section Title Start -->
                        <div class="section-title">
                            <h3 class="wow fadeInUp">contact us</h3>
                            <h2 class="text-anime-style-2" data-cursor="-opaque">Ready to get started?  <span>let's chat.</span></h2>
                        </div>
                        <!-- Section Title End -->
                    </div>

                    <div class="contact-form wow fadeInUp">




                        @if ($errors->any())
                            <div>
                                <ul class="text-danger">
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif


                        @if(session('success'))
                            <h2>{{session('success')}}</h2>
                        @else
                            <form id="contactForm" action="{{route('meetingBook')}}" method="POST" data-toggle="validator">
                                @csrf
                                <div class="row">
                                    <div class="form-group col-md-6 mb-4">
                                        <span>সম্পূর্ণ নাম</span>
                                        <input type="text" name="name" class="form-control" id="name" placeholder="আপনার নাম" required="">
                                        <div class="help-block with-errors"></div>
                                    </div>

                                    <div class="form-group col-md-6 mb-4">
                                        <span>ফোন নাম্বার</span>
                                        <input type="number" name="phone" class="form-control" id="email" placeholder="আপনার নাম্বার" required="">
                                        <div class="help-block with-errors"></div>
                                    </div>

                                    <div class="form-group col-md-6 mb-4">
                                        <span>মাসিক বাজেট</span>
                                        <select name="budget" id="budget" class="form-control monthly_budget" required>
                                            <option value="15000">১৫,০০০+ টাকা</option>
                                            <option value="30000" selected>৩০,০০০+ টাকা</option>
                                            <option value="50000">৫০,০০০+ টাকা</option>
                                            <option value="70000">৭০,০০০+ টাকা</option>
                                        </select>

                                        <div class="help-block with-errors"></div>
                                    </div>

                                    <div class="form-group col-md-6 mb-4">
                                        <span>বিজনেস প্রফাইল লিংক</span>
                                        <input type="text" name="socialProfile" class="form-control" id="website" placeholder="ফেসবুক পেজ/ ওয়েবসাইট/ প্রফাইল লিংক">
                                        <div class="help-block with-errors"></div>
                                    </div>

                                    <div class="form-group col-md-12 mb-4">
                                        <span>আপনার বার্তা</span>
                                        <textarea name="msg" class="form-control" id="msg" rows="7" placeholder="ম্যাসেজ (অপশনাল)"></textarea>
                                        <div class="help-block with-errors"></div>
                                    </div>

                                    <div class="col-md-12">
                                        <button type="submit" class="btn-default">সাবমিট</button>
                                        <div id="msgSubmit" class="h3 hidden"></div>
                                    </div>
                                </div>
                            </form>
                        @endif





                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Page contact Us End -->

    <!-- Googme Map Start -->
    <div class="google-map">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <!-- Google Map Iframe Start -->
                    <div class="google-map-iframe">
                        <iframe
                            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d96737.10562045308!2d-74.08535042841811!3d40.739265258395164!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew%20York%2C%20NY%2C%20USA!5e0!3m2!1sen!2sin!4v1703158537552!5m2!1sen!2sin"
                            allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
                    </div>
                    <!-- Google Map Iframe End -->
                </div>
            </div>
        </div>
    </div>
    <!-- Googme Map End -->
    @include('../Layouts.footer')
@endsection