@extends('web.layouts.layout')

@section('content')

    <main>
        <!-- Start section -->
        <section class="career-pg section bg_lightblue3">
            <div class="container">
                <div class="row">
                    @if($careers)
                        @foreach($careers as $career)
                            <div class="col-lg-4 col-md-6">
                                <div class="career_card wow fadeInUp">
                                    <div class="img_box">
                                        <img src="{{ getImage($career->image) }}" alt="{{ $career->currentDescription->name }}" class="sec-img"/>
                                    </div>
                                    <div class="card-body">
                                        <h5 class="title fw-bold">{{ $career->currentDescription->name }}</h5>
                                        <div class="in-flex mt-4">
                                            <a href="{{ route('career.show', $career->id) }}" class="butn primary_border_butn px-3">
                                                <i class="bi bi-arrow-right ms-0 me-2"></i> {{ __('careers.view_apply') }}
                                            </a>
                                            <span class="badge green_badge text-uppercase fw-bold px-3">{{ $career->currentDescription->type }}</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    @else
                        <div class="alert alert-warning text-center" role="alert">
                            {{ __('main.no_results') }}
                        </div>
                    @endif
                </div>
            </div>
        </section>
    </main>

@endsection