@extends('layouts.app')

@section('content')
<div class="back-wrapper">
            <!--================= Back Breadcrumbs Section Start Here =================-->
            <div class="back-breadcrumbs">
                <div class="breadcrumbs-wrap">
                    <div class="breadcrumbs-inner">
                        <div class="container">
                            <div class="breadcrumbs-text">
                                <h1 class="breadcrumbs-title">{{ __('site.contact.title') }}</h1>
                                <div class="back-nav">
                                    <ul>
                                        <li><a href="{{ route('home', ['locale' => locale_param()]) }}">{{ __('site.common.home') }}</a></li>
                                        <li>{{ __('site.contact.title') }}</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>                
            </div>
            <!--================= Back Breadcrumbs Section End Here =================-->

            <div id="back-contact" class="back-contact-page pt-70 pb-70">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <!--================= Form Section Start Here =================-->
                            <div class="back-blog-form">  
                                <div class="back-title">
                                    <h2>{{ __('site.common.get_in_touch') }}</h2>
                                </div> 
                                <div class="row"> 
                                    <div class="col-lg-3 back-address pt-12">
                                        <strong>{{ __('site.contact.call_us') }}</strong><br>
                                        <a href="tel:(404)888123456"> (404) 888 123 456 </a><br>
                                        <a href="tel:(204)888234674"> (204) 888 234 674 </a><br>

                                        <strong class="pt-30">{{ __('site.contact.email_address') }}</strong><br>
                                        <a href="mailto:info@gmail.com">info@gmail.com</a>
                                        <a href="mailto:info@gmail.com">name@gmail.com</a>

                                        <strong class="pt-30">{{ __('site.contact.local_address') }}</strong><br>
                                        <p>New York, USA 2578 HAY</p>

                                        <strong class="pt-30">{{ __('site.contact.social_share') }}</strong><br>
                                        <ul class="social-link">                                    
                                            <li><a href="#"><i class="fa-brands fa-facebook-f"></i></a></li>
                                            <li><a href="#"><i class="fa-brands fa-twitter"></i></a></li>
                                            <li><a href="#"><i class="fa-brands fa-instagram"></i></a></li>
                                            <li><a href="#"><i class="fa-brands fa-linkedin-in"></i></a></li>
                                        </ul>
                                    </div>
                                    <div class="col-lg-9">
                                        <div id="blog-form" class="blog-form">
                                            <div id="form-messages"></div>
                                            <form id="contact-form" action="{{ route('contact.store', ['locale' => locale_param()]) }}" method="post">
                                                @csrf                                                    
                                                <div class="row">
                                                    <div class="col-lg-6">
                                                        <div class="back-input">
                                                            <input id="name" type="text" name="name" placeholder="{{ __('site.contact.name') }}">
                                                        </div>
                                                    </div>

                                                    <div class="col-lg-6 pdl-5">
                                                        <div class="back-input">
                                                            <input id="email" type="email" name="email" placeholder="{{ __('site.contact.email') }}">                          
                                                        </div>
                                                    </div>
                                                    
                                                    <div class="col-lg-6">
                                                        <div class="back-input">
                                                            <input id="subject" type="text" name="subject" placeholder="{{ __('site.contact.subject') }}">                          
                                                        </div>
                                                    </div>

                                                    <div class="col-lg-6 pdl-5">
                                                        <div class="back-input">
                                                            <input id="phone" type="text" name="phone" placeholder="{{ __('site.contact.phone') }}">                   
                                                        </div>
                                                    </div>

                                                    <div class="col-lg-12">
                                                        <div class="back-textarea">
                                                            <textarea id="message" name="message" placeholder="{{ __('site.contact.message') }}"></textarea>
                                                        </div>
                                                    </div>

                                                    <div class="col-lg-12">                                                
                                                        <button type="submit" class="back-btn">{{ __('site.contact.send_message') }}</button>
                                                    </div>
                                                </div>                                                    
                                            </form>
                                        </div>
                                    </div>
                                </div>                                      
                            </div>
                            <!--================= Form Section End Here =================-->                            
                        </div>
                    </div>        
                </div>
            </div>

            <!--=================  Map Section Start Here =================-->
            <div class="back-contacts">                 
                <div class="back-image-maping">
                    <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d6146815.663617162!2d-76.67912441489939!3d37.15636527506046!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x54eab584e432360b%3A0x1c3bb99243deb742!2z4Kau4Ka-4Kaw4KeN4KaV4Ka_4KaoIOCmr-CngeCmleCnjeCmpOCmsOCmvuCmt-CnjeCmn-CnjeCmsA!5e0!3m2!1sbn!2sbd!4v1653110653067!5m2!1sbn!2sbd" width="100%" height="500" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
                </div>
            </div>                 
            <!--================= Map Section End Here =================-->
        </div>
@endsection