@forelse($jobs as $job)
  <x-job-card :job="$job" />
@empty
  <div id="noJobsState" style="text-align: center; padding: 3rem 1rem; width: 100%;">
    <i class="fas fa-briefcase" style="font-size: 3rem; color: var(--text-light); margin-bottom: 1rem;"></i>
    <h3 style="font-size: 1.25rem; margin-bottom: 0.5rem;">No Open Positions Match Your Search</h3>
    <p style="color: var(--text-muted); max-width: 500px; margin: 0 auto 1.5rem auto;">
      Try adjusting your keywords, selecting "All Departments", or submit a general profile to our talent network.
    </p>
    <button class="btn btn-primary btn-sm" data-apply-job="General Talent Network">
      <i class="fas fa-file-upload"></i> Submit General Application
    </button>
  </div>
@endforelse