@extends('frontend.layouts.app')
@section('content')
	<main class="page_main_layout contact_page">
		<section class="innerPageBanner contactPageBnr">
			<div class="container">
				<div class="contentWrapper__wr wow animate__zoomIn" data-wow-duration="2s">
					<p class="bannerTitle__wr" title="Takhlees-Contact">{{translate('Contact Us')}}</p>
					<ol class="breadcrumb__wr">
						<li><a href="{{route('home-page')}}" title="Takhlees-Home">{{translate('Home')}}</a></li>
						<li title="Takhlees-Contact">{{translate('Contact Us')}}</li>
					</ol>
				</div>
			</div>
		</section>
		<section class="addressInfoSec__wr">
			<div class="container">
				<div class="row">
					<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
						<div class="infoBoxWrap__wr wow animate__fadeInLeft" data-wow-duration="2s">
							<ul>
								<li> 
									<span class="icon"><img src="{{static_asset('assets/frontend/images/contact-location-icon.svg')}}" loading="lazy" class="imgsvg" alt="location-icon" title="location-icon"></span>
									<div class="content">
										<p class="title_label">{{translate('Head Office')}}</p>
										<p>{{get_setting('contact_address', null, $lang)}}</p>
									</div>
								</li>
								<li>
									<span class="icon"><img src="{{static_asset('assets/frontend/images/contact-mobile-icon.svg')}}" loading="lazy" class="imgsvg" alt="mobile-icon" title="mobile-icon"></span>
									<div class="content">
										<p class="title_label">{{translate('Mobile')}}</p>
										<a dir="ltr" href="tel:{{get_setting("contact_phone_one")}}" target="blank" title="{{get_setting("contact_phone_one")}}">{{get_setting("contact_phone_one")}}</a>
										<a dir="ltr" href="tel:tel:{{get_setting("contact_phone_tow")}}" target="blank" title="{{get_setting("contact_phone_tow")}}">{{get_setting("contact_phone_tow")}}</a>
									</div>
								</li>
								<li>
									<span class="icon"><img src="{{static_asset('assets/frontend/images/contact-phone-icon.svg')}}" loading="lazy" class="imgsvg" alt="phone-icon" title="phone-icon"></span>
									<div class="content">
										<p class="title_label">{{translate('Phone')}}</p>
										<a dir="ltr" href="tel:{{get_setting("contact_phone_three")}}" target="blank" title="{{get_setting("contact_phone_three")}}">{{get_setting("contact_phone_three")}}</a>
									</div>
								</li>
								<li>
									<span class="icon"><img src="{{static_asset('assets/frontend/images/contact-mail-icon.svg')}}" loading="lazy" class="imgsvg" alt="mail-icon" title="mail-icon"></span>
									<div class="content">
										<p class="title_label">{{translate('Email')}}</p>
										<a href="mailto:{{get_setting('contact_email_one')}} target="blank" title="info@takhlees.ae">{{get_setting('contact_email_one')}}</a>
										<a href="mailto:{{get_setting('contact_email_tow')}}" target="blank" title="Care@takhlees.ae">{{get_setting('contact_email_tow')}}</a>
									</div>
								</li>
							</ul>
						</div>
					</div>
					<!-- <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
						<div class="infoBoxWrap__wr wow animate__fadeInLeft" data-wow-duration="2s">
							<ul>
								<li> 
									<span class="icon"><img src="images/contact-location-icon.svg" loading="lazy" class="imgsvg" alt="location-icon" title="location-icon"></span>
									<div class="content">
										<p class="title_label">Business Center - Land Department Dubai</p>
										<p>Ground Floor, Inside Land Dept. Building, Baniyas Rd, Near Etisalat Building, Deira - Dubai.</p>
									</div>
								</li>
								<li>
									<span class="icon"><img src="images/contact-mobile-icon.svg" loading="lazy" class="imgsvg" alt="mobile-icon" title="mobile-icon"></span>
									<div class="content">
										<p class="title_label">Mobile</p>
										<a href="tel:+971509881000" target="blank" title="+971-50-988-1000">+971-50-988-1000</a>
										<a href="tel:+971502334000" target="blank" title="+971-50-233-4000">+971-50-233-4000</a>
									</div>
								</li>
								<li>
									<span class="icon"><img src="images/contact-phone-icon.svg" loading="lazy" class="imgsvg" alt="phone-icon" title="phone-icon"></span>
									<div class="content">
										<p class="title_label">Phone</p>
										<a href="tel:+97145177337" target="blank" title="+971-4-517-7337">+971-4-517-7337</a>
									</div>
								</li>
								<li>
									<span class="icon"><img src="images/contact-mail-icon.svg" loading="lazy" class="imgsvg" alt="mail-icon" title="mail-icon"></span>
									<div class="content">
										<p class="title_label">Email</p>
										<a href="mailto:info@takhlees.ae" target="blank" title="info@takhlees.ae">info@takhlees.ae</a>
										<a href="mailto:Care@takhlees.ae" target="blank" title="Care@takhlees.ae">Care@takhlees.ae</a>
									</div>
								</li>
							</ul>
						</div>
					</div> -->
					<div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mapWrapper__wr wow animate__fadeInRight" data-wow-duration="2s">
						<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3608.2540253223315!2d55.3148127!3d25.2620388!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3e5f5ccd207351b9%3A0x9e77847fdb0bcc0!2sTakhlees%20Government%20Services!5e0!3m2!1sen!2sin!4v1677495389113!5m2!1sen!2sin" width="100%" height="360" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
					</div>
				</div>
			</div>
		</section>
		<section class="sheduleStrapSec__wr">
			<div class="container">
				<div class="row align-items-lg-center">
					<div class="col-xl-5 col-lg-5 col-md-12 col-sm-12 col-12">
						<div class="tmSheduleWrap__wr wow animate__fadeInLeft" data-wow-duration="2s">
							<div class="secTitle__wr">
								<p class="title__wr">{{translate('Working Hours')}}</p>
							</div>
							{!!  page_content('contact_working_hour') !!}
						</div>
					</div>
					<div class="col-xl-7 col-lg-7 col-md-12 col-sm-12 col-12">
						<div class="callContentWrap__wr">
							<div class="callBtn__wr wow animate__heartBeat" data-wow-duration="2s"><a dir="ltr" href="{{get_setting("contact_phone_three")}}" title="{{get_setting("contact_phone_three")}}"><i class="fa-solid fa-phone"></i></a></div>
							<p class="title__wr">{{translate('What you’re waiting for?')}}</p>
							<p class="callTitle wow animate__fadeInUp" data-wow-duration="2s">{{translate('Call us now:')}} <a dir="ltr" href="{{get_setting("contact_phone_three")}}" title="{{get_setting("contact_phone_three")}}">{{get_setting("contact_phone_three")}}</a></p>
						</div>
					</div>
				</div>
			</div>
		</section>
		<section class="contactFormSec__wr">
			<div class="container">
				<div class="row">
					<div class="col-xl-5 col-lg-5 col-md-12 col-sm-12 col-12 d-none d-lg-block">
						<picture class="imageBlock__wr wow animate__fadeInLeft" data-wow-duration="2s">
							<img src="{{static_asset('assets/frontend/images/contact-formsec-bg.jpg')}}" class="img-fluid" alt="contact-formsec-bg" title="contact-formsec-bg" width="1500" height="1000">
						</picture>
					</div>
					<div class="col-xl-7 col-lg-7 col-md-12 col-sm-12 col-12">
						<div class="formBlock__wr">
							<div class="secTitle__wr wow animate__fadeInRight" data-wow-duration="2s">
								<p class="titleSup__wr">{{translate("Let's Talk")}}</p>
								<p class="title__wr">{{translate('Get In Touch')}}</p>
							</div>
							<form class="formWrapper__wr" method="POST" action="{{ route('enquiry') }}">
								@csrf
								<div class="form-row">
									<div class="form-group col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12 wow animate__fadeInUp" data-wow-duration="2s">
										<input type="text" id="name" name="name" class="form-control" placeholder="{{translate('Your Name*')}}" autocomplete="off">
									</div>
									<div class="form-group col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12 wow animate__fadeInUp" data-wow-duration="2s">
										<input type="email" id="email" name="email" class="form-control" placeholder="{{translate('Your Email')}}*" autocomplete="off" >
									</div>
									<div class="form-group col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12 wow animate__fadeInUp" data-wow-duration="2s">
										<input type="text" id="phone" name="phone" class="form-control" placeholder="{{translate('Your Phone no')}}*" autocomplete="off" >
									</div>
									<div class="form-group col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12 wow animate__fadeInUp" data-wow-duration="2s">
										<select name="subject" id="subject" class="form-control" >
											@if(\App\Models\Service::where('status', 1)->get()->isNotEmpty())
												<option value="" selected>{{translate('Select Enquiry Type')}}</option>
												@foreach (\App\Models\Service::where('status', 1)->get() as $value)
													<option value="{{$value->title}}">{{$value->getTranslation('title')}}</option>
												@endforeach
											@endif
										</select>
									</div>
									<div  class="form-group col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 wow animate__fadeInUp" data-wow-duration="2s">
										<textarea id="message" name="message" class="form-control" rows="3" placeholder="{{translate('Your Message')}}*" autocomplete="off" ></textarea>
									</div>
									<div class="form-group btnParent__wr col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
										<button type="button" id="enq_submit" class="btn primaryBtn__wr wow animate__zoomIn" data-wow-duration="2s">{{ page_content('home_sec_seven_btn_label', null, $lang) }}</button>
									</div>
								</div>
							</form>
						</div>
					</div>
				</div>
			</div>
		</section>
	</main>
@endsection