@extends('layout')
@section('title')
    <title>{{ $seo_setting->seo_title }}</title>
    <meta name="title" content="{{ $seo_setting->seo_title }}">
    <meta name="description" content="{!! strip_tags(clean($seo_setting->seo_description)) !!}">
@endsection

@section('body-content')
<main>
     <!-- banner-part-start  -->

     <section class="inner-banner">
     <div class="inner-banner-img" style=" background-image: url({{ asset($breadcrumb) }}) ;"></div>
        <div class="container">
        <div class="col-lg-12">
            <div class="inner-banner-df">
                <h1 class="inner-banner-taitel">{{ __('translate.Contact Us') }}</h1>
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="{{ route('home') }}">{{ __('translate.Home') }}</a></li>
                        <li class="breadcrumb-item active" aria-current="page">{{ __('translate.Contact Us') }}</li>
                    </ol>
                </nav>
            </div>
            </div>
        </div>
    </section>
    <!-- banner-part-end -->



    <!-- contact-us-part-start -->
    <section class="contact-us">
        <div class="container">
            <div class="row">
                <div class="col-lg-6 contact-us-wight ">
                    <h3 class="contact-us-taitel">{{ $contact_us->title }}</h3>
                    <p class="contact-us-dec">{{ $contact_us->description }}</p>


                    <div class="contact-us-item">
                        <div class="contact-us-inner">
                            <div class="icon">
                                <span>
                                    <svg width="52" height="52" viewBox="0 0 52 52" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <path
                                            d="M40.1818 0H11.8182C8.68496 0.00375309 5.68114 1.25008 3.46561 3.46559C1.25008 5.6811 0.00375312 8.6849 0 11.8181V30.7271C0.00343797 33.4504 0.945668 36.0894 2.66788 38.1991C4.39009 40.3088 6.78697 41.7602 9.45455 42.3088V49.636C9.45448 50.0639 9.57059 50.4838 9.79048 50.8509C10.0104 51.218 10.3258 51.5186 10.7031 51.7204C11.0804 51.9223 11.5054 52.018 11.9329 51.9972C12.3603 51.9765 12.774 51.8401 13.13 51.6026L26.7091 42.5452H40.1818C43.315 42.5414 46.3189 41.2951 48.5344 39.0796C50.7499 36.8641 51.9962 33.8603 52 30.7271V11.8181C51.9962 8.6849 50.7499 5.6811 48.5344 3.46559C46.3189 1.25008 43.315 0.00375309 40.1818 0ZM35.4545 28.3634H16.5455C15.9186 28.3634 15.3174 28.1144 14.8741 27.6712C14.4308 27.2279 14.1818 26.6267 14.1818 25.9998C14.1818 25.373 14.4308 24.7718 14.8741 24.3285C15.3174 23.8852 15.9186 23.6362 16.5455 23.6362H35.4545C36.0814 23.6362 36.6826 23.8852 37.1259 24.3285C37.5692 24.7718 37.8182 25.373 37.8182 25.9998C37.8182 26.6267 37.5692 27.2279 37.1259 27.6712C36.6826 28.1144 36.0814 28.3634 35.4545 28.3634ZM40.1818 18.909H11.8182C11.1913 18.909 10.5901 18.6599 10.1468 18.2167C9.70357 17.7734 9.45455 17.1722 9.45455 16.5453C9.45455 15.9185 9.70357 15.3173 10.1468 14.874C10.5901 14.4307 11.1913 14.1817 11.8182 14.1817H40.1818C40.8087 14.1817 41.4099 14.4307 41.8532 14.874C42.2964 15.3173 42.5455 15.9185 42.5455 16.5453C42.5455 17.1722 42.2964 17.7734 41.8532 18.2167C41.4099 18.6599 40.8087 18.909 40.1818 18.909Z" />
                                    </svg>
                                </span>
                            </div>

                            <div class="text">
                                <h4>{{ __('translate.Live Chat') }}</h4>

                                <p>{{ __('translate.Wait time of ~10 minutes.') }}</p>
                            </div>
                        </div>
                        <div class="contact-us-inner">
                            <div class="icon">
                                <span>
                                    <svg width="47" height="42" viewBox="0 0 47 42" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <path fill-rule="evenodd" clip-rule="evenodd"
                                            d="M4 0C1.79086 0 0 1.79086 0 4V9.79351L21.5701 25.4809C22.6221 26.2459 24.0472 26.2459 25.0991 25.4809L46.6667 9.7954V4C46.6667 1.79086 44.8758 0 42.6667 0H4ZM46.6667 12.2684L26.2755 27.0983C24.5222 28.3734 22.147 28.3734 20.3938 27.0983L0 12.2665V38C0 40.2091 1.79086 42 4 42H42.6667C44.8758 42 46.6667 40.2091 46.6667 38V12.2684Z" />
                                    </svg>
                                </span>
                            </div>

                            <div class="text">
                                <h4>{{ __('translate.Email Us') }}</h4>

                                <p>{{ $contact_us->email }}</p>
                            </div>
                        </div>
                    </div>


                    <div class="contact-box">
                        <a href="tel:{{ $contact_us->phone }}">{{ $contact_us->phone }}</a>

                        <div class="location">
                            <a href="javascript:;">
                                <span>
                                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <path
                                            d="M6 21.25C5.58579 21.25 5.25 21.5858 5.25 22C5.25 22.4142 5.58579 22.75 6 22.75V21.25ZM18 22.75C18.4142 22.75 18.75 22.4142 18.75 22C18.75 21.5858 18.4142 21.25 18 21.25V22.75ZM18.75 9.5C18.75 11.2065 17.6599 13.4136 16.1547 15.2468C15.4148 16.1481 14.6072 16.9179 13.8465 17.4554C13.0624 18.0094 12.4227 18.25 12 18.25V19.75C12.8898 19.75 13.8438 19.294 14.7121 18.6804C15.6038 18.0504 16.5071 17.1815 17.314 16.1987C18.9026 14.2638 20.25 11.7209 20.25 9.5H18.75ZM12 18.25C11.5925 18.25 10.9595 17.9993 10.171 17.4074C9.409 16.8353 8.59932 16.0178 7.85679 15.0668C6.34675 13.1327 5.25 10.825 5.25 9.11111H3.75C3.75 11.3246 5.09075 13.9614 6.67446 15.9899C7.4788 17.0201 8.38006 17.9385 9.27041 18.6069C10.1343 19.2555 11.095 19.75 12 19.75V18.25ZM5.25 9.11111C5.25 5.48059 8.47857 2.75 12 2.75V1.25C7.78944 1.25 3.75 4.51941 3.75 9.11111H5.25ZM12 2.75C15.4938 2.75 18.75 5.45503 18.75 9.5H20.25C20.25 4.54497 16.2382 1.25 12 1.25V2.75ZM14.25 9C14.25 10.2426 13.2426 11.25 12 11.25V12.75C14.0711 12.75 15.75 11.0711 15.75 9H14.25ZM12 11.25C10.7574 11.25 9.75 10.2426 9.75 9H8.25C8.25 11.0711 9.92893 12.75 12 12.75V11.25ZM9.75 9C9.75 7.75736 10.7574 6.75 12 6.75V5.25C9.92893 5.25 8.25 6.92893 8.25 9H9.75ZM12 6.75C13.2426 6.75 14.25 7.75736 14.25 9H15.75C15.75 6.92893 14.0711 5.25 12 5.25V6.75ZM6 22.75H18V21.25H6V22.75Z" />
                                    </svg>
                                </span>

                                {{ $contact_us->address }}
                            </a>
                        </div>
                    </div>


                    <div class="contact-share">
                        <div class="text">
                            <span>{{ __('translate.Follow Us') }}:</span>
                        </div>

                        <div class="icon">
                            <a href="{{ $setting->facebook }}">
                           <span>
                           <svg width="14" height="24" viewBox="0 0 14 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M8.6373 23.9531H4.79276C4.1506 23.9531 3.62822 23.4309 3.62822 22.7889V14.12H1.38524C0.743077 14.12 0.220703 13.5976 0.220703 12.9558V9.24115C0.220703 8.59918 0.743077 8.07697 1.38524 8.07697H3.62822V6.2168C3.62822 4.37238 4.20756 2.80316 5.30341 1.67908C6.4042 0.549866 7.94257 -0.046875 9.75219 -0.046875L12.6842 -0.0421143C13.3253 -0.0410156 13.8467 0.481201 13.8467 1.12207V4.57105C13.8467 5.21301 13.3246 5.73523 12.6826 5.73523L10.7085 5.73596C10.1064 5.73596 9.95312 5.85663 9.92034 5.89362C9.8663 5.95496 9.80201 6.12836 9.80201 6.60718V8.07678H12.5342C12.7399 8.07678 12.9392 8.1275 13.1104 8.22308C13.4799 8.42944 13.7096 8.81964 13.7096 9.24133L13.7081 12.956C13.7081 13.5976 13.1857 14.1198 12.5436 14.1198H9.80201V22.7889C9.80201 23.4309 9.27946 23.9531 8.6373 23.9531ZM5.03563 22.5461H8.39443V13.4901C8.39443 13.0615 8.74335 12.7128 9.17194 12.7128H12.3007L12.302 9.48395H9.17176C8.74316 9.48395 8.39443 9.13532 8.39443 8.70667V6.60718C8.39443 6.0575 8.45029 5.43237 8.86533 4.96252C9.36682 4.39453 10.1572 4.32898 10.7081 4.32898L12.4393 4.32825V1.3645L9.75109 1.36011C6.84287 1.36011 5.03563 3.22119 5.03563 6.2168V8.70667C5.03563 9.13513 4.68689 9.48395 4.25829 9.48395H1.62811V12.7128H4.25829C4.68689 12.7128 5.03563 13.0615 5.03563 13.4901V22.5461Z" />
                            </svg>

                           </span>
                            </a>
                            <a href="{{ $setting->twitter }}">
                               <span>
                               <svg width="24" height="20" viewBox="0 0 24 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M0.487379 17.5954C2.71005 19.0054 5.29683 19.7504 7.96763 19.7504C11.8788 19.7504 15.4629 18.2484 18.0607 15.5214C20.5464 12.9114 21.9138 9.40438 21.8458 5.84538C22.7881 5.03938 23.8964 3.50038 23.8964 2.00038C23.8964 1.42538 23.2722 1.06038 22.7661 1.35338C21.8808 1.87338 21.0736 2.00938 20.2433 1.77638C18.5478 0.12438 16.024 -0.22362 13.8974 0.92238C12.0389 1.92238 11.0055 3.75238 11.0986 5.75238C7.95863 5.36938 5.05775 3.79538 3.03515 1.34938C2.70305 0.95038 2.07286 0.99738 1.80878 1.44938C0.834484 3.11738 0.844487 5.05038 1.69174 6.61138C1.28862 6.68238 1.03955 7.02138 1.03955 7.38838C1.03955 8.95738 1.74576 10.3994 2.8831 11.3834C2.67104 11.5874 2.60102 11.8904 2.69104 12.1604C3.19119 13.6624 4.32353 14.8364 5.73896 15.4244C4.1995 16.1594 2.49698 16.4044 0.981528 16.2184C0.197292 16.1124 -0.189824 17.1664 0.487379 17.5954ZM8.17269 15.6814C8.73386 15.2504 8.43577 14.3524 7.73156 14.3374C6.49118 14.3114 5.36184 13.7004 4.65863 12.7394C4.99774 12.7174 5.34884 12.6654 5.68294 12.5754C6.44417 12.3694 6.40816 11.2714 5.63493 11.1164C4.2315 10.8344 3.13017 9.81238 2.71705 8.49638C3.09416 8.58938 3.47828 8.64138 3.86139 8.64838C4.62062 8.65238 4.90771 7.67938 4.28852 7.27238C2.8931 6.35338 2.29792 4.73038 2.69204 3.20438C5.12878 5.67238 8.43477 7.15938 11.9318 7.32738C12.433 7.35838 12.8091 6.88738 12.699 6.41038C12.2239 4.35138 13.3743 2.90838 14.6096 2.24338C15.832 1.58338 17.7946 1.37738 19.299 2.95538C19.7462 3.42638 21.2546 3.44438 22.0219 3.26538C21.6777 3.91338 21.1486 4.52838 20.6534 4.87438C20.4424 5.02238 20.3213 5.26838 20.3343 5.52538C20.4954 8.81038 19.271 12.0764 16.9753 14.4854C14.6626 16.9124 11.4647 18.2494 7.96863 18.2494C6.57821 18.2494 5.2148 18.0234 3.92641 17.5874C5.46688 17.2894 6.93032 16.6374 8.17269 15.6814Z" />
                                </svg>

                               </span>
                            </a>
                            <a href="{{ $setting->linkedin }}">
                               <span>
                               <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M3.24097 0.200195C2.36073 0.200195 1.56047 0.520211 0.960289 1.12021C0.320112 1.7602 0 2.56016 0 3.40016C0 4.28015 0.360108 5.08016 0.960289 5.68016C1.56047 6.28016 2.40072 6.64016 3.20098 6.60018C3.20098 6.60018 3.24097 6.60018 3.28102 6.60018C4.08127 6.60018 4.84149 6.28016 5.44167 5.68016C6.04185 5.08016 6.40195 4.28015 6.40195 3.40016C6.44195 2.56016 6.08184 1.76015 5.48166 1.16015C4.88148 0.520164 4.08123 0.200195 3.24097 0.200195ZM4.88148 5.1202C4.44133 5.56021 3.84115 5.8402 3.20098 5.80021C2.6008 5.80021 1.96062 5.56021 1.52047 5.1202C1.04033 4.68018 0.800256 4.0402 0.800256 3.40021C0.800256 2.76023 1.04033 2.16023 1.52047 1.68023C1.96062 1.24021 2.5608 1.00021 3.24097 1.00021C3.84115 1.00021 4.44133 1.24021 4.88148 1.68023C5.36163 2.16023 5.6017 2.76023 5.6017 3.40021C5.6017 4.0402 5.36163 4.68018 4.88148 5.1202Z"  stroke-width="0.3"/>
                                <path d="M4.80173 7.40039H1.56075C0.920578 7.40039 0.400391 7.92037 0.400391 8.60039V22.6004C0.400391 23.2404 0.960575 23.8004 1.60075 23.8004H4.80173C5.44191 23.8004 6.00209 23.2404 6.00209 22.6404V8.60039C6.00209 7.96036 5.44191 7.40039 4.80173 7.40039ZM5.20183 22.6404C5.20183 22.8404 5.00176 23.0004 4.80173 23.0004H1.60075C1.40068 23.0004 1.20065 22.8004 1.20065 22.6004V8.60039C1.20065 8.40037 1.36068 8.20041 1.56075 8.20041H4.80173C5.0018 8.20041 5.20183 8.40042 5.20183 8.60039V22.6404Z"  stroke-width="0.3"/>
                                <path d="M18.406 7H17.5658C16.0053 7 14.5249 7.68002 13.5646 8.76002V8.2C13.5646 7.80002 13.1645 7.39998 12.7643 7.39998H8.76315C8.40304 7.39998 7.96289 7.72 7.96289 8.15997V23.08C7.96289 23.52 8.40304 23.8 8.76315 23.8H13.1645C13.5246 23.8 13.9647 23.52 13.9647 23.08V14.44C13.9647 13.12 14.925 12.0799 16.1654 12.0799C16.8056 12.0799 17.4057 12.3199 17.8459 12.76C18.246 13.12 18.4061 13.68 18.4061 14.4V23C18.4061 23.4 18.8062 23.8 19.2063 23.8H23.2075C23.6076 23.8 24.0078 23.4 24.0078 23V12.68C24.0077 9.48002 21.567 7 18.406 7ZM23.2075 22.96L23.1675 23H19.2463L19.2063 14.4C19.2063 13.44 18.9662 12.72 18.4461 12.2C17.8459 11.6 17.0456 11.28 16.2054 11.28C14.5249 11.32 13.2045 12.68 13.2045 14.44V23H8.80314V8.2H12.7643L12.8043 8.23998V10.76L13.8847 9.67999L13.9247 9.64C14.7249 8.52002 16.1253 7.80002 17.6058 7.80002H18.446C21.1268 7.80002 23.2075 9.96002 23.2075 12.68V22.96Z"   stroke-width="0.3"/>
                                </svg>

                               </span>
                            </a>
                            <a href="{{ $setting->instagram }}">
                               <span>
                               <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path fill-rule="evenodd" clip-rule="evenodd" d="M1.25 6C1.25 3.37665 3.37665 1.25 6 1.25H18C20.6234 1.25 22.75 3.37665 22.75 6V18C22.75 20.6234 20.6234 22.75 18 22.75H6C3.37665 22.75 1.25 20.6234 1.25 18V6ZM6 2.75C4.20507 2.75 2.75 4.20507 2.75 6V18C2.75 19.7949 4.20507 21.25 6 21.25H18C19.7949 21.25 21.25 19.7949 21.25 18V6C21.25 4.20507 19.7949 2.75 18 2.75H6Z" />
                                <path d="M19 6C19 6.55228 18.5523 7 18 7C17.4477 7 17 6.55228 17 6C17 5.44772 17.4477 5 18 5C18.5523 5 19 5.44772 19 6Z" />
                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12 7.75C9.65279 7.75 7.75 9.65279 7.75 12C7.75 14.3472 9.65279 16.25 12 16.25C14.3472 16.25 16.25 14.3472 16.25 12C16.25 9.65279 14.3472 7.75 12 7.75ZM6.25 12C6.25 8.82436 8.82436 6.25 12 6.25C15.1756 6.25 17.75 8.82436 17.75 12C17.75 15.1756 15.1756 17.75 12 17.75C8.82436 17.75 6.25 15.1756 6.25 12Z" >
                                </svg>

                               </span>
                            </a>
                        </div>
                    </div>


                </div>

                <div class="col-lg-6">
                    <div class="get-in-touch">
                        <h3 class="get-in-touch-taitel">{{ __('translate.Get in Touch') }}</h3>

                        <form action="{{ route('store-contact-message') }}" method="POST">
                            @csrf

                            <div class="get-in-touch-form-item">
                                <div class="get-in-touch-form-inner">
                                    <label for="exampleFormControlInput1" class="form-label">{{ __('translate.Name') }}
                                        <span>*</span>
                                    </label>
                                    <input type="text" class="form-control" id="exampleFormControlInput1"
                                        placeholder="{{ __('translate.Name') }}" name="name" value="{{ old('name') }}">
                                </div>
                                <div class="get-in-touch-form-inner">
                                    <label for="exampleFormControlInput2" class="form-label">{{ __('translate.Phone number') }}
                                        <span>*</span>
                                    </label>
                                    <input type="text" class="form-control" id="exampleFormControlInput2"
                                        placeholder="{{ __('translate.Phone number') }}" name="phone" value="{{ old('phone') }}">
                                </div>
                            </div>
                            <div class="get-in-touch-form-item">
                                <div class="get-in-touch-form-inner">
                                    <label class="form-label">{{ __('translate.Email') }}
                                        <span>*</span>
                                    </label>
                                    <input type="email" class="form-control" id="exampleFormControlInput4"
                                        placeholder="{{ __('translate.Email') }}" value="{{ old('email') }}" name="email">
                                </div>
                                <div class="get-in-touch-form-inner">
                                    <label for="exampleFormControlInput3" class="form-label">{{ __('translate.Subject') }}
                                        <span>*</span>
                                    </label>
                                    <input type="text" class="form-control" id="exampleFormControlInput3"
                                        placeholder="{{ __('translate.Subject') }}" name="subject" value="{{ old('subject') }}">
                                </div>
                            </div>
                            <div class="get-in-touch-form-item">
                                <div class="get-in-touch-form-inner">
                                    <label for="exampleFormControlInput6" class="form-label">{{ __('translate.Message') }}
                                        <span>*</span>
                                    </label>
                                    <textarea class="form-control" id="exampleFormControlTextarea6" rows="8"
                                        placeholder="{{ __('translate.Type Here') }}" name="message">{{ old('message') }}</textarea>
                                </div>

                            </div>

                            @if($google_recaptcha->status==1)
                                <div class="get-in-touch-form-item">
                                    <div class="get-in-touch-form-inner">
                                        <div class="g-recaptcha" data-sitekey="{{ $google_recaptcha->site_key }}"></div>
                                    </div>
                                </div>
                            @endif


                            <button type="submit" class="thm-btn-two">{{ __('translate.Send Message') }}</button>

                        </form>

                    </div>

                </div>
            </div>

        </div>

        <div class="contact-map" >

            <iframe src="{{ $contact_us->map_code }}" width="600" height="450" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
        </div>

    </section>
    <!-- contact-us-part-end -->

</main>

@endsection

@push('js_section')
<script src="https://www.google.com/recaptcha/api.js" async defer></script>

@endpush