@extends('layouts.web.main')

@section('contents')

<!-- Start of breadcrumb section ============================================= -->
	<section class="in-breadcrumb-contentc mt-1 px-4 py-5 my-5 text-center">
		<div class="in-breadcrumb-content position-relative" ></div> 
	</section>
	<!-- End of breadcrumb section ============================================= -->

	<!-- Start of Service section ============================================= -->
	<section id="in-service" class="in-service-section mt-10">
		<div class="container">
			<div class="in-section-title-2 text-center headline pera-content">
				<h2>You can reach us</h2>
				<p>Contact Lighthouse Insurance Brokers Ltd for advisory, quotes, policy queries, or claims support. We respond to business and personal enquiries during office hours and prioritise urgent claim notifications.</p>

				{{-- <p>We offer a wide range of insurance services to meet your needs. Our team of experts is here to help you find the right insurance coverage for your home, car, life, health, and more. We are committed to providing you with the best customer service and support. Contact us today to learn more about our services and how we can help you protect what matters most.</p> --}}
			</div>
		</div>
	</section>
	<!-- End of Service section ============================================= -->


<!-- Start of Contact Page section ============================================= -->
	<section id="in-contact-page" class="in-contact-page-section position-relative">
		<div class="in-google-map mt-10">
			{{-- <iframe class="map" src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d6209.242755903148!2d-77.04363602434464!3d38.90977276948481!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2sus!4v1394992895496"  height="590" width="100%"></iframe> --}}
			<iframe class="map" src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d20839.84193899508!2d39.27773164813074!3d-6.755210121117116!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2stz!4v1774185369694!5m2!1sen!2stz" lwidth="600" height="450" width="100%" loading="lazy"></iframe>
		</div>	
		<div class="container">
			<div class="in-contact-page-content position-relative">
				<div class="row">
					<div class="col-lg-6">
						<div class="in-faq-contact-info-wrap">
							<div class="in-faq-contact-info-title headline pera-content">
								<h3>Contact Us </h3>
								<p>Visit our Dar es Salaam office, call, or email—we're here to help with insurance placement and claims.</p>
							</div>
							<div class="in-faq-contact-info">
								<div class="info-item-area d-flex align-items-center">
									<div class="inner-icon d-flex align-items-center justify-content-center">
										<i class="fal fa-map-marker-alt"></i>
									</div>
									<div class="inner-text headline pera-content">
										<h4>Office address</h4>
										<p>Renaissance Plaza, 498 Haile Selassie Road, 3rd Floor<br>
										P.O. Box 12866, Dar es Salaam, Tanzania</p>
									</div>
								</div>
								<div class="info-item-area d-flex align-items-center">
									<div class="inner-icon d-flex align-items-center justify-content-center">
										<i class="fal fa-envelope-open-text"></i>
									</div>
									<div class="inner-text headline pera-content">
										<h4>Email</h4>
										<p>info@lrb.co.tz</p>
									</div>
								</div>
								<div class="info-item-area d-flex align-items-center">
									<div class="inner-icon d-flex align-items-center justify-content-center">
										<i class="fal fa-phone-plus"></i>
									</div>
									<div class="inner-text headline pera-content">
										<h4>Phone</h4>
										<p>+255 748 677 688</p>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="col-lg-6">
						<div class="in-faq-contact-form-area">
							<div class="in-faq-contact-info-title headline pera-content">
								<h3>Get In Touch  </h3>
								<p>Send a message with your name, contact details, and whether you need a quote, policy change, or claims help.</p>
							</div>
							<div class="in-faq-contact-form">
								<form id="contact-form" action="{{ route('contact.store') }}" method="POST" autocomplete="on">

									@if(session('success'))
										<div class="alert alert-success mb-4" role="alert">
											{{ session('success') }}
										</div>
									@endif

									@csrf

									@honeypot

									<div class="row">
										<div class="col-md-6 mb-3">
											<input type="text" name="name" class="form-control @error('name') is-invalid @enderror" placeholder="Name" value="{{ old('name') }}">
											@if ($errors->has('name'))
												<div class="invalid-feedback">
													{{ $errors->first('name') }}
												</div>
											@endif
										</div>
										<div class="col-md-6 mb-3">
											<input type="email" name="email" class="form-control @error('email') is-invalid @enderror" placeholder="Email" value="{{ old('email') }}">
											@if ($errors->has('email'))
												<div class="invalid-feedback">
													{{ $errors->first('email') }}
												</div>
											@endif
										</div>
										<div class="col-md-6 mb-3">
											<input type="text" name="phone" class="form-control @error('phone') is-invalid @enderror" placeholder="Phone" value="{{ old('phone') }}">
											@if ($errors->has('phone'))
												<div class="invalid-feedback">
													{{ $errors->first('phone') }}
												</div>
											@endif
										</div>
										<div class="col-md-6 mb-3">
											<input type="text" name="subject" class="form-control @error('subject') is-invalid @enderror" placeholder="Subject" value="{{ old('subject') }}">
											@if ($errors->has('subject'))
												<div class="invalid-feedback">
													{{ $errors->first('subject') }}
												</div>
											@endif
										</div>
										<div class="col-md-12 mb-3">
											<textarea name="message" class="form-control @error('message') is-invalid @enderror" placeholder="Message" rows="5">{{ old('message') }}</textarea>
											@if ($errors->has('message'))
												<div class="invalid-feedback">
													{{ $errors->first('message') }}
												</div>
											@endif
										</div>
										<div class="col-md-12">
											<button type="submit" class="btn btn-primary btn-lg">Submit Now</button>
										</div>
									</div>
								</form>

								{{-- <div class="max-w-2xl mx-auto p-6 bg-white shadow-md rounded-lg">
									<h2 class="text-2xl font-bold mb-6">Contact Us</h2>

									@if(session('success'))
										<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
											{{ session('success') }}
										</div>
									@endif

									<form action="{{ route('contact.store') }}" method="POST">
										@csrf
										
										<!-- Spam Protection: Honeypot (Requires spatie/laravel-honeypot) -->
										@honeypot

										<div class="mb-4">
											<label class="block text-gray-700">Name</label>
											<input type="text" name="name" value="{{ old('name') }}" 
												class="w-full border rounded px-3 py-2 @error('name') border-red-500 @enderror">
											@error('name') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
										</div>

										<div class="mb-4">
											<label class="block text-gray-700">Email</label>
											<input type="email" name="email" value="{{ old('email') }}" 
												class="w-full border rounded px-3 py-2 @error('email') border-red-500 @enderror">
											@error('email') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
										</div>

										<div class="mb-4">
											<label class="block text-gray-700">Message</label>
											<textarea name="message" rows="4" class="w-full border rounded px-3 py-2 @error('message') border-red-500 @enderror">{{ old('message') }}</textarea>
											@error('message') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
										</div>

										<button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">
											Send Message
										</button>
									</form>
								</div> --}}
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>	
<!-- End of Contact Page  section ============================================= -->	


<!-- Start of Sponsor section ============================================= -->
	<section id="in-sponsor" class="in-sponsor-section-2">
		<div class="container">
			<div class="in-sponsor-slider">
				<div class="in-sponsor-item">
					<div class="inner-img">
						<img src="assets/img/sponsor/spn1.png" alt="">
					</div>
				</div>
				<div class="in-sponsor-item">
					<div class="inner-img">
						<img src="assets/img/sponsor/spn2.png" alt="">
					</div>
				</div>
				<div class="in-sponsor-item">
					<div class="inner-img">
						<img src="assets/img/sponsor/spn3.png" alt="">
					</div>
				</div>
				<div class="in-sponsor-item">
					<div class="inner-img">
						<img src="assets/img/sponsor/spn4.png" alt="">
					</div>
				</div>
				<div class="in-sponsor-item">
					<div class="inner-img">
						<img src="assets/img/sponsor/spn5.png" alt="">
					</div>
				</div>
				<div class="in-sponsor-item">
					<div class="inner-img">
						<img src="assets/img/sponsor/spn1.png" alt="">
					</div>
				</div>
				<div class="in-sponsor-item">
					<div class="inner-img">
						<img src="assets/img/sponsor/spn2.png" alt="">
					</div>
				</div>
			</div>
		</div>
	</section>	
<!-- End of Sponsor section ============================================= -->		


@endsection