@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>
                            @foreach($applications as $application)
                                <div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
                                     data-parent="#accordion">
                                    <div class="card-body">
                                        <div class="faq-flex">
                                            <div class="faq-wrapp">
                                                <h4>{{$application->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">{{\Illuminate\Support\Str::limit($application->description, 100) ?? ''}}</p>
                                            </div>
                                            <a href="{{route('career.job.detail',['slug' => $application->title, 'id' => $application->id])}}" class="themeBtn">
                                                View job</a>
                                        </div>

                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection