@extends('web.layouts.app')

@section('title', $career->title)

@section('content')
    <!-- Main Content for Single Career Page -->
    <div class="container">
        <h1>{{ $career->title }}</h1>
        <p><strong>{{ __('Location:') }}</strong> {{ $career->location }}</p>
        <p><strong>{{ __('Salary:') }}</strong> {{ $career->salary_per_month }} {{ $career->salary_currency }}</p>

        <h2>{{ __('Description') }}</h2>
        <p>{{ $career->title_description }}</p>

        @if ($career->bullets)
            <h3>{{ __('Responsibilities and Qualifications') }}</h3>
            <ul>
                @foreach ($career->bullets as $bullet)
                    <li>{{ $bullet['bullet'] }}</li>
                @endforeach
            </ul>
        @endif

        <!-- Apply Button - Triggers Modal -->
        <button type="button" class="btn btn-success" data-bs-toggle="modal" data-bs-target="#applyInternshipModal">
            {{ __('Apply for this Career') }}
        </button>
    </div>

    <!-- Application Modal -->
    @include('web.components.application_modal', ['jobId' => $career->id, 'jobType' => 'career'])
@endsection