@extends('layouts.webpage.main_two')

@section('page-title', 'Career')

@section('content')

 <!-- Top Header -->

    <section class="hero-section about-ban"
    style="background-image: url('{{ $hero_career && $hero_career->image_url
        ? asset('uploads/hero_career/' . $hero_career->image_url)
        : asset('uploads/Products_banner.png') }}')">
        <div class="hero-content about-inner">
            <!-- <h6 class="about-title"><img src="{{asset('assets/img/prod-banner.svg')}}">Career</h6> -->
            <h1 class="service-title">{{$hero_career->title ?? 'Career'}}</h1>
            <a href="{{ route('request') }}"><button class="btn main-butn mt-2"> Get a Quote<i class="bi bi-chevron-right"></i></button></a>
            <!-- <a href="#" class="btn main-butn mt-4">View Projects</a> -->
        </div>
    </section>


    <div data-aos="fade-up">
        <section class="current">
            <div class="container text-center py-5">
                <h2 class="main-title">Current Openings</h2>
                <div class="row g-4 pt-4 text-start">

                    @if($careers->isNotEmpty())
                        @foreach($careers as $career)
                            <div class="col-lg-4 col-md-6">
                                <div class="job-card">
                                    <small>{{ $career->employment_type ?? 'Full-Time' }}</small>
                                    <h3 class="mt-2">{{ $career->job_title ?? 'Job Title' }}</h3>

                                    <div class="d-flex justify-content-between my-2 text-muted purchase">
                                        <span><i class="bi bi-geo-alt"></i> Location: {{ $career->location ?? 'Not Specified' }}</span>
                                        <span><i class="bi bi-calendar-event"></i> Experience: {{ $career->experience ?? 'N/A' }}</span>
                                    </div>

                                    <p class="mb-2"><strong>SKILLS</strong></p>
                                    <p class="text-muted">
                                        {{ $career->requirements ?? 'Not mentioned' }}
                                    </p>

                                     <a href="{{ route('career.apply', $career->id) }}" class="main-butn">
                                        Apply Now <i class="bi bi-arrow-right"></i>
                                    </a>
                          
                                </div>
                            </div>
                        @endforeach
                    @else
                        <p class="text-muted py-4">No current openings available right now.</p>
                    @endif

                </div>
            </div>
        </section>
    </div>




@endsection