@extends('layouts.web-main')
@section('content')
		<div class="inner-banner-one position-relative">
			<div class="container">
				<div class="position-relative">
					<div class="row">
						<div class="col-xl-8 m-auto text-center">
                            <div class="post-date">{{ \Carbon\Carbon::parse($details->created_at)->format('d M Y') }} by <a href="#" class="fw-500 text-white">{{$details->get_employer->name ?? ''}}</a></div>
							<div class="title-two">
                                <h2 class="text-white">{{$details->job_title}}</h2>
                            </div>
							<ul class="share-buttons d-flex flex-wrap justify-content-center style-none mt-10">
								<li><a href="{{$details->get_employer->facebook_url ?? ''}}" class="d-flex align-items-center justify-content-center">
									<i class="bi bi-facebook"></i>
									<span>Facebook</span>
								</a></li>
								<li><a href="#" class="d-flex align-items-center justify-content-center">
									<i class="bi bi-twitter"></i>
									<span>Twitter</span>
								</a></li>
								<li><a href="#" class="d-flex align-items-center justify-content-center">
									<i class="bi bi-link-45deg"></i>
									<span>Copy</span>
								</a></li>
							</ul>
						</div>
					</div>
				</div>
			</div>
			<img src="images/lazy.svg" data-src="images/shape/shape_02.svg" alt="" class="lazy-img shapes shape_01">
			<img src="images/lazy.svg" data-src="images/shape/shape_03.svg" alt="" class="lazy-img shapes shape_02">
		</div> <!-- /.inner-banner-one -->



		<!-- 
		=============================================
			Job Details
		============================================== 
		-->
		<section class="job-details style-two pt-100 lg-pt-80 pb-130 lg-pb-80">
			<div class="container">
				<div class="row">
					<div class="col-xxl-9 col-xl-10 m-auto">
						<div class="details-post-data ps-xxl-4 pe-xxl-4">
							<ul class="job-meta-data-two d-flex flex-wrap justify-content-center justify-content-lg-between style-none">
                                <div class="bg-wrapper bg-white text-center"> 
                                    <img src="{{ asset('assets/images/lazy.svg') }}" data-src="{{ asset('assets/images/icon/icon_52.svg') }}" alt="" class="lazy-img m-auto icon">
                                    <span>Salary</span>
                                    <div>{{substr($details->min_salary, 0, 2) }}k-{{substr($details->max_salary, 0, 2) }}k/year</div>
                                </div>
                                <div class="bg-wrapper bg-white text-center">
                                    <img src="{{ asset('assets/images/lazy.svg') }}" data-src="{{ asset('assets/images/icon/icon_53.svg') }}" alt="" class="lazy-img m-auto icon">
                                    <span>Expertise</span>
                                    <div>{{$details->experience }}</div>
                                </div>
                                <div class="bg-wrapper bg-white text-center">
                                    <img src="{{ asset('assets/images/lazy.svg') }}" data-src="{{ asset('assets/images/icon/icon_54.svg') }}" alt="" class="lazy-img m-auto icon">
                                    <span>Location</span>
                                    <div>{{$details->location }} </div>
                                </div>
                                <div class="bg-wrapper bg-white text-center">
                                    <img src="{{ asset('assets/images/lazy.svg') }}" data-src="{{ asset('assets/images/icon/icon_55.svg') }}" alt="" class="lazy-img m-auto icon">
                                    <span>Job Type</span>
                                    <div>{{$details->job_type }}</div>
                                </div>
                                <div class="bg-wrapper bg-white text-center">
                                    <img src="{{ asset('assets/images/lazy.svg') }}" data-src="{{ asset('assets/images/icon/icon_56.svg') }}" alt="" class="lazy-img m-auto icon">
                                    <span>Experience</span>
                                    <div>{{$details->experience }}</div>
                                </div>
                            </ul>

							<div class="post-block mt-50 lg-mt-40">
								<h4 class="block-title">Overview</h4>
								<p>{{$details->overview }} <a href="#">Learn more here</a>. Please indicate which location(s) you're interested.</p>
							</div>
							<div class="post-block mt-60 lg-mt-40">
								<h4 class="block-title">Job Description</h4>
								<p>As a <a href="#">{{$details->job_title }}</a> at {{$details->get_employer->name ?? '' }}, {{$details->job_description }}</p>
								<!-- <p>We understand our responsibility to create a diverse, equitable, and inclusive place within the tech industry, while pushing to make our industry more representative. </p> -->
							</div>
							<div class="post-block mt-70 lg-mt-40">
								<h4 class="block-title">Responsibilities</h4>
								<ul class="list-type-one style-none mb-15">
									<li>{{$details->responsibilities }}.</li>
									<!-- <li>Co-lead ideation sessions, workshops, demos, and presentations with clients on-site</li>
									<li>Push for and create inclusive, accessible design for all</li>
									<li>Maintain quality of the design process and ensure that when designs are translated into code they accurately reflect the design specifications.</li>
									<li>Sketch, wireframe, build IA, motion design, and run usability tests</li>
									<li>Design pixel perfect responsive UI’s and understand that adopting common interface pattern is better for UX than reinventing the wheel</li>
									<li>Ensure content strategy and design are perfectly in-sync</li>
									<li>Give and receive design critique to help constantly refine and push our work</li> -->
								</ul>
							</div>
							<div class="post-block mt-55 lg-mt-40">
								<h4 class="block-title">Required Skills:</h4>
								<ul class="list-type-two style-none mb-15">
									<li>{{$details->job_skills }}.</li>
									<!-- <li>A portfolio that exemplifies strong visual design and a focus on defining the user experience.</li>
									<li>You’ve proudly shipped and launched several products.</li>
									<li>You have some past experience working in an agile environment – Think two-week sprints.</li>
									<li>Experience effectively presenting and communicating your design decisions to clients and team members</li>
									<li>Up-to-date knowledge of design software like Figma, Sketch etc.</li> -->
								</ul>
							</div>
							<div class="post-block mt-55 lg-mt-40">
								<h4 class="block-title">Benefits:</h4>
								<ul class="list-type-two style-none mb-15">
									<li>{{$details->benefits }}.</li>
									<!-- <li>100% company-paid health insurance premiums for you & your dependents</li>
									<li>Vacation stipend</li>
									<li>Unlimited paid vacation and paid company holidays</li>
									<li>Monthly wellness/gym stipend</li> -->
								</ul>
							</div>
								@if(Auth::check() && (Auth::user()->role_id  == 3))
                                     <a href="{{route('resume')}}" class="btn-ten fw-500 text-white text-center tran3s mt-30">Apply for this position</a>
                                @endif
                                 	@if(!Auth::check())
                                     <a href="{{route('sign-up')}}" class="btn-ten fw-500 text-white text-center tran3s mt-30">Apply for this position</a>
                                @endif
						</div>
						<!-- /.details-post-data -->
					</div>
				</div>
			</div>
		</section>





		<!--
		=====================================================
			Job Portal Intro
		=====================================================
		-->
		<section class="job-portal-intro">
			<div class="container">
				<div class="wrapper bottom-border pt-65 md-pt-50 pb-65 md-pb-50">
					<div class="row align-items-center">
						<div class="col-lg-7">
							<div class="text-center text-lg-start">
								<h2>Most complete job portal.</h2>
								<p class="text-md m0 md-pb-20">Signup and start find your job or talents.</p>
							</div>
						</div>
						<div class="col-lg-5">
							<ul class="btn-group style-none d-flex flex-wrap justify-content-center justify-content-lg-end">
								@if(Auth::check() && (Auth::user()->role_id  == 3))
								<li class="me-2"><a href="{{route('all-jobs')}}" class="btn-three">Looking for job?</a></li>
								@endif
								@if(Auth::check() && (Auth::user()->role_id  == 2))
								<li class="ms-2"><a href="{{ route('post-job')}}" class="btn-four">Post a job</a></li>
								@endif
	
								@if(!Auth::check())
								<li class="me-2"><a href="{{route('sign-up')}}" class="btn-three">Looking for job?</a></li>
								<li class="ms-2"><a href="{{ route('sign-up')}}" class="btn-four">Post a job</a></li>
	
								@endif
							</ul>
						</div>
					</div>
				</div>
			</div>
		</section>
		<!-- /.job-portal-intro -->

@endsection