@extends('front.layout.app')
@section('content')

    <section class="innerbanner">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h2>Careers</h2>
                </div>
            </div>
        </div>
    </section>

    <section class="looking-sec">
        <div class="container">
            <div class="row justify-content-center text-center">
                <div class="col-md-9">
                    <div class="looking-content">
                        <h3 class="subHead"> We’re hiring!</h3>
                        <h2 class="mainHead">We’re looking for talented people</h2>
                        <p>Our philosophy is simple — hire a team of passionate people and
                            foster a culture that empowers you to do your best work.</p>
                        <a href="" class="themeBtn">APPLICATION</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="faq-section">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-md-12">
                    <div id="accordion">
                        <div class="card">
                            <div id="headingOne">
                                <h5 class="mb-0">
                                    <button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne"
                                            aria-expanded="true" aria-controls="collapseOne">
                                        Available Careers
                                        <i class="fas fa-plus"></i>
                                    </button>
                                </h5>
                            </div>
                            <div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
                                 data-parent="#accordion">
                                <div class="card-body">
                                    @foreach($applications as $application)
                                    <div class="faq-flex">
                                        <div class="faq-wrapp">
                                            <h4>{{$application->job_title ?? ''}}</h4>
                                            <figure class="flag-img">
                                                <img src="{{asset('assets/images/flag.png')}}" class="img-fluid" alt="">
                                                <h5>{{$application->address ?? ''}}</h5>
                                            </figure>
                                            <p class="text-primary">{{$application->type ?? ''}}</p>
                                        </div>
                                        <a href="{{route('career.job.detail',['slug' => $application->job_title, 'id' => $application->id])}}" class="themeBtn">
                                            View job</a>
                                    </div>
                                    @endforeach
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection