@extends('admin.layout')

@section('page-title', 'Laporan Data Alumni')
@section('page-subtitle', 'Detail Hasil Pengisian Tracer Study')

@section('content')
    <div class="space-y-6">
        <!-- 1. Identitas Section -->
        <div class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
            <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50 flex justify-between items-center">
                <h3 class="text-lg font-medium text-gray-900 dark:text-white flex items-center">
                    <svg class="w-5 h-5 mr-2 text-blue-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path>
                    </svg>
                    Identitas Alumni <span class="ml-2 text-xs font-mono text-pink-500 font-bold">f1</span>
                </h3>
                 <a href="{{ route('alumni.index') }}" class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-300">
                    <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
                    </svg>  
                </a>
            </div>
            <div class="p-6 grid grid-cols-1 md:grid-cols-2 gap-6">
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">NIM</label>
                    <div class="text-gray-900 dark:text-white font-semibold">{{ $alumni->NoMhsw }}</div>
                </div>
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">Kode PT</label>
                    <div class="text-gray-900 dark:text-white">{{ $alumni->KodePT }} - Universitas Muhammadiyah Jember</div>
                </div>
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">Tahun Lulus</label>
                    <div class="text-gray-900 dark:text-white">{{ $alumni->TahunLulus }}</div>
                </div>
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">Program Studi</label>
                    <div class="text-gray-900 dark:text-white">{{ $alumni->prodi_name }}</div>
                </div>
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">Nama Alumni</label>
                    <div class="text-gray-900 dark:text-white">{{ $alumni->Nama }}</div>
                </div>
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">Nomor Telepon/HP</label>
                    <div class="text-gray-900 dark:text-white">{{ $alumni->Telp }}</div>
                </div>
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">Email</label>
                    <div class="text-gray-900 dark:text-white">{{ $alumni->Email }}</div>
                </div>
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">NIK</label>
                    <div class="text-gray-900 dark:text-white">{{ $alumni->nik ?? '-' }}</div>
                </div>

                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">Surveyor</label>
                    <div class="text-gray-900 dark:text-white font-semibold text-blue-600 truncate">{{ $alumni->surveyor->Nama ?? '-' }}</div>
                </div>
                <div class="space-y-1">
                    <label class="text-sm font-medium text-gray-500 dark:text-gray-400">Status Konfirmasi</label>
                    <div>
                        @if($alumni->StatusKonfirmasi == 'Y')
                            <span class="px-2 py-0.5 bg-green-100 text-green-800 rounded-full text-xs font-bold">Data Sudah Dikonfirmasi</span>
                        @else
                            <span class="px-2 py-0.5 bg-yellow-100 text-yellow-800 rounded-full text-xs font-bold">Data Belum Dikonfirmasi</span>
                        @endif
                    </div>
                </div>
            </div>
        </div>

        @php
            $ts = $alumni;
            $emp = $alumni;
            $comp = $alumni;
            $learn = $alumni;
            $jobSearch = $alumni;
        @endphp

        <!-- 2. Tracer Study - Kuisioner Wajib -->
        <div class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
            <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50">
                <h3 class="text-lg font-medium text-gray-900 dark:text-white">Tracer Study - Kuisioner Wajib</h3>
            </div>
            <div class="p-6 space-y-6">
                <!-- f8 Status -->
                <div>
                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                        <span class="text-pink-500 font-bold font-mono mr-1">f8</span> Jelaskan status anda saat ini?
                    </label>
                    <div class="space-y-2 ml-4">
                        @foreach([
                                '1' => 'Bekerja (full time/part time)',
                                '2' => 'Belum Memungkinkan bekerja',
                                '3' => 'Wiraswasta',
                                '4' => 'Melanjutkan Pendidikan',
                                '5' => 'Tidak Kerja tetapi sedang mencari kerja'
                            ] as $val => $label)
                                <div class="flex items-center">
                                    <input type="radio" disabled {{ ($alumni->f8 == $val) ? 'checked' : '' }} class="h-4 w-4 text-blue-600 border-gray-300">
                                    <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">[{{ $val }}] {{ $label }}</span>
                                </div>
                        @endforeach
                    </div>
                </div>

                <!-- f504 Waktu Tunggu -->
                <div class="bg-gray-50 dark:bg-gray-700/30 p-4 rounded-md">
                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                        <span class="text-pink-500 font-bold font-mono mr-1">f504</span> Apakah anda telah mendapatkan pekerjaan <= 6 bulan?
                    </label>
                    <div class="ml-4 space-y-4">
                        <!-- Ya -->
                        <div>
                             <div class="flex items-center mb-1">
                                <input type="radio" disabled {{ ($alumni->f504 == '1') ? 'checked' : '' }} class="h-4 w-4 text-blue-600 border-gray-300">
                                <span class="ml-2 text-sm font-semibold text-gray-700 dark:text-gray-300">[1] Ya</span>
                            </div>
                            <div class="ml-6 flex items-center text-sm text-gray-600 dark:text-gray-400">
                                Dalam berapa bulan? <span class="mx-2 font-bold px-2 py-0.5 bg-white dark:bg-gray-600 border rounded">{{ $alumni->f502 ?? '-' }}</span> bulan (f502)
                            </div>
                        </div>
                        <!-- Tidak -->
                        <div>
                             <div class="flex items-center mb-1">
                                <input type="radio" disabled {{ ($alumni->f504 == '2') ? 'checked' : '' }} class="h-4 w-4 text-blue-600 border-gray-300">
                                <span class="ml-2 text-sm font-semibold text-gray-700 dark:text-gray-300">[2] Tidak</span>
                            </div>
                            <div class="ml-6 flex items-center text-sm text-gray-600 dark:text-gray-400">
                                Dalam berapa bulan? <span class="mx-2 font-bold px-2 py-0.5 bg-white dark:bg-gray-600 border rounded">{{ $alumni->f506 ?? '-' }}</span> bulan (f506)
                            </div>
                        </div>
                    </div>
                </div>

                <!-- f505 Pendapatan -->
                <div>
                     <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                        <span class="text-pink-500 font-bold font-mono mr-1">f505</span> Berapa rata-rata pendapatan anda per bulan?
                    </label>
                    <div class="ml-4 flex items-center">
                        <span class="px-3 py-2 bg-gray-100 dark:bg-gray-700 border border-gray-300 dark:border-gray-600 rounded-lg text-gray-900 dark:text-white font-mono">
                            Rp {{ (isset($alumni->f505) && is_numeric($alumni->f505)) ? number_format($alumni->f505, 0, ',', '.') : ($alumni->f505 ?: '0') }}
                        </span>
                    </div>
                </div>
            </div>
        </div>

        <!-- 3. Data Pekerjaan (Employment Info) -->
        <div class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
            <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50">
                <h3 class="text-lg font-medium text-gray-900 dark:text-white">Data Pekerjaan</h3>
            </div>
            <div class="p-6 grid grid-cols-1 md:grid-cols-2 gap-6">
                <!-- Lokasi Kerja -->
                <div class="md:col-span-2">
                     <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                        Lokasi Tempat Bekerja <span class="text-pink-500 text-xs font-mono">(f5a1, f5a2)</span>
                    </label>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                         <div>
                            <span class="text-xs text-gray-500">Provinsi</span>
                            <div class="p-2 bg-gray-50 dark:bg-gray-700 rounded border border-gray-200 dark:border-gray-600 text-gray-800 dark:text-gray-200">
                                {{ $alumni->province_name }}
                            </div>
                         </div>
                         <div>
                            <span class="text-xs text-gray-500">Kabupaten/Kota</span>
                            <div class="p-2 bg-gray-50 dark:bg-gray-700 rounded border border-gray-200 dark:border-gray-600 text-gray-800 dark:text-gray-200">
                                {{ $alumni->regency_name }}
                            </div>
                         </div>
                    </div>
                </div>

                <!-- f11 Jenis Perusahaan -->
                <div class="md:col-span-2">
                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                        <span class="text-pink-500 font-bold font-mono mr-1">f11</span> Jenis Perusahaan/Instansi
                    </label>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-2 ml-4">
                        @foreach([
                                1 => 'Instansi pemerintah',
                                2 => 'Organisasi non-profit/Lembaga Swadaya',
                                3 => 'Perusahaan swasta',
                                4 => 'Wiraswasta/perusahaan sendiri',
                                5 => 'BUMN/BUMD',
                                6 => 'Institusi/Organisasi Multilateral',
                                7 => 'Lainnya'
                            ] as $val => $label)
                                <div class="flex items-center">
                                    <input type="radio" disabled {{ ($alumni->f11 == $val) ? 'checked' : '' }} class="h-4 w-4 text-blue-600 border-gray-300">
                                    <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">[{{ $val }}] {{ $label }}</span>
                                </div>
                        @endforeach
                    </div>
                </div>

                <!-- f5b Nama Perusahaan -->
                <div>
                     <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                        <span class="text-pink-500 font-bold font-mono mr-1">f5b</span> Nama Perusahaan
                    </label>
                    <div class="mt-1 p-2 bg-gray-50 dark:bg-gray-700 rounded border border-gray-200 dark:border-gray-600 text-gray-900 dark:text-white">
                        {{ $alumni->f5b ?? '-' }}
                    </div>
                </div>
                 <!-- f5c Posisi (Wiraswasta) -->
                <div>
                     <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                        <span class="text-pink-500 font-bold font-mono mr-1">f5c</span> Posisi (Wiraswasta)
                    </label>
                     <div class="mt-1 p-2 bg-gray-50 dark:bg-gray-700 rounded border border-gray-200 dark:border-gray-600 text-gray-900 dark:text-white">
                        @php
                            $posisi = [1 => 'Founder', 2 => 'Co-Founder', 3 => 'Staff', 4 => 'Freelance/Kerja Lepas'];
                        @endphp
                        {{ $posisi[$alumni->f5c] ?? '-' }}
                    </div>
                </div>

                 <!-- f5d Tingkat Tempat Kerja -->
                <div>
                     <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                        <span class="text-pink-500 font-bold font-mono mr-1">f5d</span> Tingkat Tempat Kerja
                    </label>
                     <div class="mt-1 p-2 bg-gray-50 dark:bg-gray-700 rounded border border-gray-200 dark:border-gray-600 text-gray-900 dark:text-white">
                        @php
                            $tingkat = [1 => 'Lokal/wilayah/wiraswasta tidak berbadan hukum', 2 => 'Nasional/wiraswasta berbadan hukum', 3 => 'Multinasional/internasional'];
                        @endphp
                        {{ $tingkat[$alumni->f5d] ?? '-' }}
                    </div>
                </div>

                <!-- f14 Hubungan Bidang Studi -->
                 <div class="md:col-span-2">
                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                        <span class="text-pink-500 font-bold font-mono mr-1">f14</span> Hubungan Bidang Studi dengan Pekerjaan
                    </label>
                    <div class="flex flex-wrap gap-4 ml-4">
                         @foreach([1 => 'Sangat Erat', 2 => 'Erat', 3 => 'Cukup Erat', 4 => 'Kurang Erat', 5 => 'Tidak Sama Sekali'] as $val => $label)
                            <div class="flex items-center">
                                <input type="radio" disabled {{ ($alumni->f14 == $val) ? 'checked' : '' }} class="h-4 w-4 text-blue-600 border-gray-300">
                                <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">[{{ $val }}] {{ $label }}</span>
                            </div>
                        @endforeach
                    </div>
                </div>

                <!-- f15 Tingkat Pendidikan -->
                 <div class="md:col-span-2">
                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                        <span class="text-pink-500 font-bold font-mono mr-1">f15</span> Tingkat Pendidikan yang Sesuai
                    </label>
                    <div class="flex flex-wrap gap-4 ml-4">
                         @foreach([1 => 'Setingkat Lebih Tinggi', 2 => 'Tingkat yang Sama', 3 => 'Setingkat Lebih Rendah', 4 => 'Tidak Perlu Pendidikan Tinggi'] as $val => $label)
                            <div class="flex items-center">
                                <input type="radio" disabled {{ ($alumni->f15 == $val) ? 'checked' : '' }} class="h-4 w-4 text-blue-600 border-gray-300">
                                <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">[{{ $val }}] {{ $label }}</span>
                            </div>
                        @endforeach
                    </div>
                </div>

            </div>
        </div>

        <!-- 3.1 Alasan Tidak Sesuai (f16) -->
        <div class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
            <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50">
                <h3 class="text-lg font-medium text-gray-900 dark:text-white">Alasan Pekerjaan Tidak Sesuai Pendidikan (f16)</h3>
            </div>
            <div class="p-6 space-y-4">
                @php
                    $f16Labels = [
                        'f1601' => 'Pertanyaan tidak sesuai; pekerjaan saya sekarang sudah sesuai dengan pendidikan saya',
                        'f1602' => 'Saya belum mendapatkan pekerjaan yang lebih sesuai',
                        'f1603' => 'Di pekerjaan ini saya memeroleh prospek karir yang baik',
                        'f1604' => 'Saya lebih suka bekerja di area pekerjaan yang tidak ada hubungannya dengan pendidikan saya',
                        'f1605' => 'Saya dipromosikan ke posisi yang kurang berhubungan dengan pendidikan saya dibanding posisi sebelumnya',
                        'f1606' => 'Saya dapat memeroleh pendapatan yang lebih tinggi di pekerjaan ini',
                        'f1607' => 'Pekerjaan saya saat ini lebih aman/terjamin/secure',
                        'f1608' => 'Pekerjaan saya saat ini lebih menarik',
                        'f1609' => 'Pekerjaan saya saat ini lebih memungkinkan saya mengambil pekerjaan tambahan/jadwal yang fleksibel, dll',
                        'f1610' => 'Pekerjaan saya saat ini lokasinya lebih dekat dari rumah saya',
                        'f1611' => 'Pekerjaan saya saat ini dapat lebih menjamin kebutuhan keluarga saya',
                        'f1612' => 'Pada awal meniti karir ini, saya harus menerima pekerjaan yang tidak berhubungan dengan pendidikan saya',
                        'f1613' => 'Lainnya',
                    ];
                @endphp
                <div class="grid grid-cols-1 md:grid-cols-2 gap-x-6 gap-y-2 ml-4">
                    @foreach($f16Labels as $key => $label)
                        <div class="flex items-start">
                            <input type="checkbox" disabled {{ ($alumni->$key != 0 && !empty($alumni->$key)) ? 'checked' : '' }} class="h-4 w-4 text-orange-500 border-gray-300 rounded mt-1">
                            <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">{{ $label }}</span>
                        </div>
                    @endforeach
                </div>
                @if($alumni->f1614)
                <div class="mt-2 ml-4 p-2 bg-gray-50 dark:bg-gray-700 rounded border border-gray-200 dark:border-gray-600 text-sm text-gray-800 dark:text-gray-200">
                    <strong>Lainnya:</strong> {{ $alumni->f1614 }}
                </div>
                @endif
            </div>
        </div>

        <!-- 4. Kompetensi (f17) -->
        <div class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
            <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50">
                <h3 class="text-lg font-medium text-gray-900 dark:text-white">Kompetensi (f17)</h3>
                <p class="text-xs text-gray-500">A: Dikuasai saat lulus | B: Diperlukan dalam pekerjaan</p>
            </div>
            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
                    <thead class="bg-gray-50 dark:bg-gray-700">
                        <tr>
                            <th rowspan="2" class="px-4 py-2 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/3">Kompetensi</th>
                            <th colspan="5" class="px-4 py-1 text-center text-xs font-medium text-gray-500 dark:text-gray-300 uppercase bg-blue-50 dark:bg-blue-900/20 border-l border-r border-gray-200 dark:border-gray-600">A (Penguasaan)</th>
                            <th colspan="5" class="px-4 py-1 text-center text-xs font-medium text-gray-500 dark:text-gray-300 uppercase bg-green-50 dark:bg-green-900/20">B (Kebutuhan)</th>
                        </tr>
                        <tr class="text-center text-xs text-gray-400">
                            @for($i = 1; $i <= 5; $i++) <th class="py-1 border-l border-gray-200 dark:border-gray-600">{{ $i }}</th> @endfor
                            @for($i = 1; $i <= 5; $i++) <th class="py-1 border-l border-gray-200 dark:border-gray-600">{{ $i }}</th> @endfor
                        </tr>
                    </thead>
                    <tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
                        @php
                            $competencies = [
                                'Etika' => ['a' => 'f1761', 'b' => 'f1762'],
                                'Keahlian Bidang Ilmu' => ['a' => 'f1763', 'b' => 'f1764'],
                                'Bahasa Inggris' => ['a' => 'f1765', 'b' => 'f1766'],
                                'Teknologi Informasi' => ['a' => 'f1767', 'b' => 'f1768'],
                                'Komunikasi' => ['a' => 'f1769', 'b' => 'f1770'],
                                'Kerja Sama Tim' => ['a' => 'f1771', 'b' => 'f1772'],
                                'Pengembangan Diri' => ['a' => 'f1773', 'b' => 'f1774']
                            ];
                        @endphp
                        @foreach($competencies as $label => $keys)
                            <tr>
                                <td class="px-4 py-2 font-medium text-sm text-gray-900 dark:text-white">{{ $label }}</td>
                                <!-- A -->
                                @for($i = 1; $i <= 5; $i++)
                                    <td class="px-2 py-2 text-center border-l border-gray-100 dark:border-gray-700">
                                        <input type="radio" disabled {{ ($alumni->{$keys['a']} ?? 0) == $i ? 'checked' : '' }} class="h-3 w-3 text-blue-600">
                                    </td>
                                @endfor
                                <!-- B -->
                                @for($i = 1; $i <= 5; $i++)
                                    <td class="px-2 py-2 text-center border-l border-gray-100 dark:border-gray-700">
                                         <input type="radio" disabled {{ ($alumni->{$keys['b']} ?? 0) == $i ? 'checked' : '' }} class="h-3 w-3 text-green-600">
                                    </td>
                                @endfor
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>

        <!-- 5. Metode Belajar (f2) -->
        <div class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
             <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50">
                <h3 class="text-lg font-medium text-gray-900 dark:text-white">Metode Pembelajaran (f2)</h3>
                <p class="text-xs text-gray-500">Penekanan metode pembelajaran di program studi</p>
            </div>
            <div class="p-6">
                 <div class="grid grid-cols-1 gap-4">
                     @php
                        $methods = [
                            'f21' => 'Perkuliahan',
                            'f22' => 'Demonstrasi',
                            'f23' => 'Partisipasi Riset',
                            'f24' => 'Magang',
                            'f25' => 'Praktikum',
                            'f26' => 'Kerja Lapangan',
                            'f27' => 'Diskusi'
                        ];
                    @endphp
                    @foreach($methods as $key => $label)
                        <div class="flex items-center justify-between border-b border-gray-100 dark:border-gray-700 pb-2 last:border-0">
                            <span class="text-sm text-gray-700 dark:text-gray-300 w-1/3">{{ $label }}</span>
                            <div class="flex space-x-4">
                                @foreach([1 => 'Sangat Besar', 2 => 'Besar', 3 => 'Cukup', 4 => 'Kurang', 5 => 'Tidak Sama Sekali'] as $val => $desc)
                                    <div class="flex flex-col items-center">
                                        <input type="radio" disabled {{ ($alumni->$key == $val) ? 'checked' : '' }} class="h-3 w-3 text-blue-600 mb-1">
                                        <span class="text-[10px] text-gray-500">{{ $val }}</span>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    @endforeach
                 </div>
                 <div class="mt-4 flex justify-between text-xs text-gray-400 px-4">
                     <span>1: Sangat Besar</span>
                     <span>5: Tidak Sama Sekali</span>
                 </div>
            </div>
        </div>

        <!-- 6. Pencarian Kerja (Job Search) -->
    <div class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50">
            <h3 class="text-lg font-medium text-gray-900 dark:text-white">Pencarian Kerja (f3, f4)</h3>
        </div>
        <div class="p-6 space-y-6">
             <!-- f3 Tipe Mencari Kerja -->
             <div>
                <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                    <span class="text-pink-500 font-bold font-mono mr-1">f3</span> Kapan anda mulai mencari pekerjaan?
                </label>
                <div class="ml-4 space-y-2">
                    @foreach([
                        1 => 'Saya mencari pekerjaan sebelum lulus',
                        2 => 'Saya mencari pekerjaan sesudah lulus',
                        3 => 'Saya tidak mencari pekerjaan'
                    ] as $val => $label)
                    <div class="flex items-center">
                        <input type="radio" disabled {{ ($alumni->f3 == $val) ? 'checked' : '' }} class="h-4 w-4 text-blue-600 border-gray-300">
                        <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">[{{ $val }}] {{ $label }}</span>
                    </div>
                    @endforeach
                </div>
            </div>

            <!-- f302 / f303 Waktu Mencari -->
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6 ml-4">
                 <div>
                     <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
                        Berapa bulan <strong>SEBELUM</strong> lulus? <span class="text-pink-500 text-xs font-mono">(f302)</span>
                    </label>
                    <div class="flex items-center">
                        <span class="px-3 py-2 bg-gray-100 dark:bg-gray-700 border border-gray-300 dark:border-gray-600 rounded-lg text-gray-900 dark:text-white font-mono">
                            {{ $alumni->f302 ?? '-' }}
                        </span>
                        <span class="ml-2 text-sm text-gray-500">Bulan</span>
                    </div>
                 </div>
                 <div>
                     <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
                        Berapa bulan <strong>SESUDAH</strong> lulus? <span class="text-pink-500 text-xs font-mono">(f303)</span>
                    </label>
                     <div class="flex items-center">
                        <span class="px-3 py-2 bg-gray-100 dark:bg-gray-700 border border-gray-300 dark:border-gray-600 rounded-lg text-gray-900 dark:text-white font-mono">
                            {{ $alumni->f303 ?? '-' }}
                        </span>
                        <span class="ml-2 text-sm text-gray-500">Bulan</span>
                    </div>
                 </div>
            </div>

            <!-- f4 Job Search Methods -->
             <div>
                <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                    <span class="text-pink-500 font-bold font-mono mr-1">f4</span> Bagaimana anda mencari pekerjaan tersebut?
                </label>
                 <div class="grid grid-cols-1 md:grid-cols-2 gap-2 ml-4">
                    @php
                        $searchMethods = [
                            1 => 'Melalui iklan di koran/majalah, brosur',
                            2 => 'Melamar ke perusahaan tanpa mengetahui lowongan',
                            3 => 'Pergi ke bursa/pameran kerja',
                            4 => 'Mencari lewat internet/iklan online/milis',
                            5 => 'Dihubungi oleh perusahaan',
                            6 => 'Menghubungi Kemahasiswaan/Alumni',
                            7 => 'Membangun jejaring (network) sejak kuliah',
                            8 => 'Melalui relasi (misal dosen, orang tua, saudara, teman)',
                            9 => 'Membangun bisnis sendiri',
                            10 => 'Melalui penempatan kerja atau magang',
                            11 => 'Bekerja di tempat yang sama dengan tempat dpt kerja',
                            12 => 'Lainnya'
                        ];
                        // Get selected methods checking f401 to f412
                        $selectedMethods = [];
                        foreach ($searchMethods as $key => $label) {
                             $col = 'f4' . str_pad($key, 2, '0', STR_PAD_LEFT);
                             if (($alumni->$col != 0 && !empty($alumni->$col))) {
                                  $selectedMethods[] = $key;
                             }
                        }
                    @endphp
                    @foreach($searchMethods as $val => $label)
                    <div class="flex items-center">
                        <input type="checkbox" disabled {{ in_array($val, $selectedMethods) ? 'checked' : '' }} class="h-4 w-4 text-blue-600 border-gray-300 rounded">
                        <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">[{{ $val }}] {{ $label }}</span>
                    </div>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
    
    <!-- Footer/Action -->
        <div class="flex justify-between items-center bg-gray-50 dark:bg-gray-700/50 px-6 py-4 rounded-lg shadow">
             <a href="{{ route('alumni.index') }}" class="text-gray-600 dark:text-gray-400 hover:underline text-sm">Kembali ke Daftar</a>
             <a href="{{ route('alumni.edit', $alumni->IDValueAlumni) }}" class="px-6 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-md shadow transition-colors font-medium"> Edit Data Alumni </a>
        </div>

    </div>
@endsection