@unless (count($jobs) == 0)
    <div class="container mx-auto py-10">
        <h3 class="text-3xl text-indigo-900 dark:text-indigo-400 text-center">Recent Jobs</h3>
        <div class="text-right">
            {{-- <a href="hot-jobs" class="text-blue-500 mr-10">View All</a> --}}
        </div>
        <hr class="py-3 mt-3 dark:opacity-20 ">
        <div class="flex flex-row justify-center flex-wrap">
            @foreach ($jobs as $job)
            <div class="basis-full md:basis-1/2 lg:basis-1/3 xl:basis-1/4 w-full rounded-lg pb-5 md:p-5 leading-6">
                <a href="{{ getJobDetailsUrl($job) }}" class="" target="_blank">
                    <div
                    class="bg-white dark:bg-opacity-5 max-w-md border-b-indigo-400 border-opacity-50 rounded-lg overflow-hidden shadow-md hover:shadow-xl hover:border-indigo-200 hover:border-b-indigo-400 hover:-mt-2 border-2 border-indigo-200 transition-all duration-500 mx-auto w-full bg-rose-501 h-full">
                <div class="p-6 py-4">
                            <h3 class="font-medium text-xl text-indigo-600 dark:text-indigo-300 hover:text-blue-600">
                                {{ $job->title }}</h3>
                            <div class="pt-2">
                                <span class="font-semibold">
                                    {{ $job->company_name }}
                                </span>
                                <br>
                                Exp:
                                @if (isset($job->experience_min))
                                {{ $job->experience_min }} - {{ $job->experience_max }} Year
                            {{-- @else
                            <x-unspecified /> --}}
                            @endif
                        <br>
                                Industry:
                                {{ $job->industry_id ? getIndustryByIndustryId($job->industry_id) : ($job->industry_name ?? '') }}
                            </div>
                        </div>
                        <div class="flex justify-start items-center px-6 pb-4">
                            <a href="{{ getLocationSlug($job->city) }}">
                                <span
                                class="inline-block bg-blue-100 rounded-full px-3 py-1 text-sm text-gray-500 mr-2 mb-2">{{ $job->city }}</span>
                            </a>
                            <a href="{{ getLocationSlug($job->state) }}">
                                <span
                                class="inline-block bg-blue-100 rounded-full px-3 py-1 text-sm text-gray-500 mr-2 mb-2">{{ $job->state }}</span>
                            </a>
                        @if($job->is_verified)
                        <span class="inline-flex items-center gap-1 bg-green-100 text-green-700 px-2 py-1 rounded-full text-xs font-semibold">
                            <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
                                <path d="M10 18l-6-3.5V5.5L10 2l6 3.5v9L10 18z" />
                            </svg>
                            Verified
                        </span>
                        @endif
                    </div>
                </div>
                    </a>
                </div>
            @endforeach
        </div>
    </div>
@endunless