@extends('en.layouts.layout')
@section('contant')
	<!-- Banner Section Four -->
    <section class="banner-section-four">
        <div class="banner-carousel owl-carousel owl-theme">
            <!-- Slide Item -->
            @foreach (\App\Models\Banners::all() as $item)
            <div class="slide-item" style="background-image: url('{{$item->picture}}')">
                <div class="auto-container">
                    <div class="content-box">                        
                        <h2>{!! $item->title !!}</h2>
                    </div>
                </div>
            </div>
            @endforeach          
        </div>
				
    </section>
    <!-- End Banner Section -->


	<!-- Experiance Section -->
	<section class="experiance-section">
		<div class="auto-container">
			<div class="row">
				<div style="text-align:center;margin-left:auto;margin-right:auto;">
					<iframe width="700" height="400" src="https://www.youtube.com/embed/ud4M2Mv-YG8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
				</div>
			</div>
			<!-- Experiance Info Tabs -->
			<div class="experiance-info-tabs">
				<!-- Experiance Tabs -->
				<div class="experiance-tabs tabs-box">
				
					<!-- Tab Btns-->
					<ul class="tab-btns tab-buttons clearfix">
                    @foreach (\App\Models\Servicedetails::all()->where('service_id', 3) as $item)
                        @php if(!isset($active_btn)){$active_btn = 'active-btn'; }else{$active_btn='';} @endphp
						<li data-tab="#prod-{{$item->id}}" class="tab-btn  {{$active_btn}}"><img src="{{$item->picture}}" alt=""  width="50px"><br><br> {{$item->title}} </li>
                    @endforeach
					</ul>
					
					<!--Tabs Container-->
					<div class="tabs-content">
                        @foreach (\App\Models\Servicedetails::all()->where('service_id', 3) as $item)     
                            @php if(!isset($active_tab)){$active_tab = 'active-tab'; }else{$active_tab='';} @endphp                       
                            <div class="tab {{$active_tab}}" id="prod-{{$item->id}}">
                                <div class="content">								
                                    <div class="text">{!! $item->description !!}</div>							
                                </div>
                            </div>                        
                        @endforeach												
					</div>
				</div>
				
			</div>
		</div>
	</section>
	<!-- End Experiance Section -->

	<!-- Fluid Section One -->
	<div class="container-fluid">
		<div class="row">
			<div class="photocradle" style="width:100%;min-height: 900px;"></div>	
		</div>		
	</div>

	<!-- Call To Action Two -->
	<section class="call-to-action-section-two">
		<div class="auto-container">
			<div class="inner-container">
				<h3 style="font-size: 21px;">
				{{ \App\Models\Settings::where('id', 16)->first()->value }}
				</h3>				
			</div>
		</div>
	</section>

	<!-- End Call To Action Two -->

	<section class="text-center">
		<div class="auto-container paddTop40">
			<div class="inner-container">
			   <a href="{{route('brands')}}" >
				<img width="300px" src="{{ asset( \App\Models\Images::where('id', 1)->first()->picture ) }}" alt="Makeen" />
				</a>
				<br>
				<a href="{{route('brands')}}" class="btn btn-md btn-danger" style="background-color:#9e0309;">
					Discover our brands >
				</a>
			</div>
		</div>
	</section>
	

	
	<!-- News Section -->
	<section class="news-section">
		<div class="auto-container">
			<!-- Sec Title -->
			<div class="sec-title centered">
				<div class="title">{{ \App\Models\Settings::where('id', 17)->first()->value }}</div>
				<h2> {{ \App\Models\Settings::where('id', 18)->first()->value }}</h2>
			</div>
			<div class="row clearfix">
				<!-- News Block -->
				@foreach (\App\Models\Servicedetails::all()->where('service_id', 2) as $item)
				<div class="news-block col-lg-4 col-md-6 col-sm-12">
					<div class="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
						<div class="image">
							<a href="{{route('press-details', $item->id)}}"><img src="{{$item->picture}}" alt="" /></a>
						</div>
						<div class="lower-content">
							
							<h4><a href="{{route('press-details', $item->id)}}">{{$item->title}}</a></h4>
							<div class="text">{!! $item->description !!}</div>
							<a class="read-more" href="{{route('press-details', $item->id)}}">Read More<span class="arrow flaticon-long-arrow-pointing-to-the-right"></span></a>
						</div>
					</div>
				</div>
				@endforeach

			</div>
		</div>
	</section>
	<!-- End News Section -->

	<!-- Map Section -->
	<section class="contact-map-section">
		<div class="auto-container">
			<!-- Map Boxed -->
			<div class="map-boxed">
				<!--Map Outer-->
				<div class="map-outer">
					<iframe
						src="{{ \App\Models\Settings::where('id', 19)->first()->value }}"
						width="100%" height="450" style="border:0;" allowfullscreen="" loading="lazy"
						referrerpolicy="no-referrer-when-downgrade" class="form-control"></iframe>
				</div>
			</div>
		</div>
	</section>
	<!-- End Map Section -->
@endsection