@php
        $headRoute = $puRouteBases['trreq'] ?? 'pengajuan';
        $headHistoryRoute = \Illuminate\Support\Facades\DB::table('sys_dmenu')
        ->where('dmenu', 'trhis')
        ->value('url') ?? 'history';
        // Get data
        $items = $table_detail_d ?? collect();

        // Jika kosong, query langsung dari database
        if ($items->isEmpty()) {
        $items = \Illuminate\Support\Facades\DB::table('tr_non_periodic')
        ->leftJoin('ms_area', 'tr_non_periodic.area_id', '=', 'ms_area.id')
        ->select('tr_non_periodic.*', 'ms_area.nama_area as area_name')
        ->orderBy('tr_non_periodic.created_at', 'desc')
        ->get();
        }
        $areaMap = \Illuminate\Support\Facades\DB::table('ms_area')
        ->pluck('nama_area', 'id');

        $currentHeadUser = $user_login ?? ($currentUser ?? auth()->user());
        if (!$currentHeadUser && session()->has('username')) {
        $currentHeadUser = \Illuminate\Support\Facades\DB::table('users')
        ->where('username', session('username'))
        ->first();
        }

        $currentHeadUserId = $currentHeadUser->id ?? null;
        $currentHeadRoles = array_map('trim', explode(',', strtolower((string) ($currentHeadUser->idroles ?? ''))));
        $isCurrentViewerAdmin = in_array('admins', $currentHeadRoles, true) || in_array('admin', $currentHeadRoles, true);
        $headDepartmentIds = collect();
        if ($currentHeadUserId && !$isCurrentViewerAdmin) {
        $headDepartmentIds = \Illuminate\Support\Facades\DB::table('ms_department')
        ->where('head_user_id', $currentHeadUserId)
        ->where('is_active', '1')
        ->pluck('id')
        ->map(fn ($id) => (int) $id)
        ->unique()
        ->values();

        // Compatibility for data that has not been migrated yet.
        if ($headDepartmentIds->isEmpty()) {
        $headDepartmentIds = \Illuminate\Support\Facades\DB::table('ms_employee')
        ->where('user_id', $currentHeadUserId)
        ->where('is_active', '1')
        ->whereNotNull('departemen_id')
        ->pluck('departemen_id')
        ->map(fn ($id) => (int) $id)
        ->unique()
        ->values();
        }
        }

        $requestUserIds = $items->pluck('user_id')
        ->filter(fn ($id) => $id !== null && $id !== '' && is_numeric((string) $id))
        ->map(fn ($id) => (int) $id);

        $requestUsernames = $items->flatMap(function ($item) {
        $values = [];
        $uid = isset($item->user_id) ? (string) $item->user_id : '';
        $createdBy = trim((string) ($item->user_create ?? ''));

        if ($uid !== '' && !is_numeric($uid)) {
        $values[] = strtolower($uid);
        }

        if ($createdBy !== '') {
        $values[] = strtolower($createdBy);
        }

        return $values;
        })->filter()->unique()->values();

        $usernameToUserId = $requestUsernames->isNotEmpty()
        ? \Illuminate\Support\Facades\DB::table('users')
        ->whereIn(\Illuminate\Support\Facades\DB::raw('LOWER(username)'), $requestUsernames->all())
        ->pluck('id', 'username')
        ->mapWithKeys(fn ($id, $username) => [strtolower((string) $username) => (int) $id])
        : collect();

        $requestDepartmentByUserId = $requestUserIds
        ->merge($usernameToUserId->values())
        ->unique()
        ->values()
        ->whenNotEmpty(function ($userIds) {
        return \Illuminate\Support\Facades\DB::table('ms_employee')
        ->whereIn('user_id', $userIds->all())
        ->where('is_active', '1')
        ->pluck('departemen_id', 'user_id')
        ->map(fn ($departmentId) => $departmentId ? (int) $departmentId : null);
        }, fn () => collect());

        $resolveItemDepartmentId = function ($item) use ($usernameToUserId, $requestDepartmentByUserId) {
        if (!empty($item->request_department_id)) {
        return (int) $item->request_department_id;
        }

        $requestUserId = null;
        $uid = isset($item->user_id) ? (string) $item->user_id : '';
        if ($uid !== '' && is_numeric($uid)) {
        $requestUserId = (int) $uid;
        } else {
        $legacyUsernames = array_filter([
        $uid !== '' ? strtolower($uid) : null,
        strtolower(trim((string) ($item->user_create ?? ''))),
        ]);

        foreach ($legacyUsernames as $legacyUsername) {
        $requestUserId = $usernameToUserId->get($legacyUsername);
        if ($requestUserId) {
        break;
        }
        }
        }

        if (!$requestUserId) {
        return null;
        }

        $departmentId = $requestDepartmentByUserId->get($requestUserId);

        return $departmentId ? (int) $departmentId : null;
        };

        $displayItems = $items->filter(function ($item) use ($isCurrentViewerAdmin, $headDepartmentIds, $resolveItemDepartmentId) {
        if ($isCurrentViewerAdmin) {
        return true;
        }

        $departmentId = $resolveItemDepartmentId($item);

        return $departmentId && $headDepartmentIds->contains($departmentId);
        })->map(function ($item) use ($areaMap) {
        if (empty($item->area_name) && !empty($item->area_id)) {
        $item->area_name = $areaMap->get((int) $item->area_id)
        ?? $areaMap->get((string) $item->area_id);
        }

        return $item;
        })->values();
        $statusField = 'request_status';
        if ($displayItems->first() && isset($displayItems->first()->status)) {
        $statusField = 'status';
        }

        $hrdUserIds = \Illuminate\Support\Facades\DB::table('users')
        ->where(function ($q) {
        $q->whereRaw("FIND_IN_SET('hrdxxx', REPLACE(LOWER(idroles), ' ', ''))")
        ->orWhereRaw("FIND_IN_SET('hrd', REPLACE(LOWER(idroles), ' ', ''))");
        })
        ->pluck('id')
        ->map(fn ($id) => (int) $id)
        ->all();

        $hrdUsernames = \Illuminate\Support\Facades\DB::table('users')
        ->where(function ($q) {
        $q->whereRaw("FIND_IN_SET('hrdxxx', REPLACE(LOWER(idroles), ' ', ''))")
        ->orWhereRaw("FIND_IN_SET('hrd', REPLACE(LOWER(idroles), ' ', ''))");
        })
        ->pluck('username')
        ->map(fn ($username) => strtolower((string) $username))
        ->all();

        $isHrdSubmission = function ($item) use ($hrdUserIds, $hrdUsernames) {
        $uid = isset($item->user_id) ? (string) $item->user_id : '';
        $uidInt = is_numeric($uid) ? (int) $uid : null;
        $createdBy = strtolower((string) ($item->user_create ?? ''));

        if ($uidInt !== null && in_array($uidInt, $hrdUserIds, true)) {
        return true;
        }

        if ($uid !== '' && !is_numeric($uid) && in_array(strtolower($uid), $hrdUsernames, true)) {
        return true;
        }

        return $createdBy !== '' && in_array($createdBy, $hrdUsernames, true);
        };

        $currentUserId = $user_login->id ?? null;
        $sessionUsername = strtolower(trim((string) (session('username') ?? '')));
        $modelUsername = strtolower(trim((string) ($user_login->username ?? '')));
        $currentUsername = $sessionUsername !== '' && !is_numeric($sessionUsername)
        ? $sessionUsername
        : $modelUsername;

        $isCurrentViewerHrd = ($currentUserId && in_array((int) $currentUserId, $hrdUserIds, true))
        || ($currentUsername !== '' && in_array($currentUsername, $hrdUsernames, true));

        $isOwnedByCurrentUser = function ($item) use ($currentUserId, $currentUsername) {
        $uid = isset($item->user_id) ? (string) $item->user_id : '';
        $createdBy = strtolower((string) ($item->user_create ?? ''));

        $byUserId = $currentUserId && $uid !== '' && is_numeric($uid) && (int) $uid === (int) $currentUserId;
        $byLegacyUserId = $currentUsername !== '' && $uid !== '' && !is_numeric($uid) && strtolower($uid) === $currentUsername;
        $byUserCreate = $currentUsername !== '' && $createdBy === $currentUsername;

        return $byUserId || $byLegacyUserId || $byUserCreate;
        };



        // Filter pending items - status pending atau review yang belum ada head_approval_date
        $pendingItems = $displayItems->filter(function ($item) use ($statusField, $isHrdSubmission) {
        $statusValue = strtolower($item->{$statusField} ?? '');
        return ($statusValue === 'pending' || $statusValue === 'review')
        && empty($item->head_approval_date)
        && !$isHrdSubmission($item);
        });

        // Approved count
        $approvedCount = $displayItems->filter(function ($item) use ($statusField) {
        $statusValue = strtolower($item->{$statusField} ?? '');
        return !empty($item->head_approval_date) && in_array($statusValue, ['review', 'approved', 'pengadaan', 'pengerjaan', 'completed']);
        })->count();

        // Rejected count
        $rejectedCount = $displayItems->filter(function ($item) use ($statusField) {
        $statusValue = strtolower($item->{$statusField} ?? '');
        return in_array($statusValue, ['rejected', 'reject']);
        })->count();

        // Completed count
        $completedCount = $displayItems->where($statusField, 'completed')->count();

        // History items - semua yang sudah diproses head atau ditolak
        $historyItems = $displayItems->filter(function ($item) use ($statusField) {
        $statusValue = strtolower($item->{$statusField} ?? '');
        return !empty($item->head_approval_date) || in_array($statusValue, ['rejected', 'reject', 'cancel', 'cancelled', 'canceled']);
        });

        // Verifikasi HRD di menu Pengajuan PU (mirip user)
        $verifikasiItems = collect();
        if ($isCurrentViewerHrd) {
        $verifikasiItems = $displayItems->filter(function ($item) use ($statusField, $isOwnedByCurrentUser) {
        $statusValue = strtolower($item->{$statusField} ?? '');
        return $statusValue === 'verifikasi' && $isOwnedByCurrentUser($item);
        })->values();
        }

        $trackingItems = $displayItems->filter(function ($item) use ($statusField) {
        $statusValue = strtolower($item->{$statusField} ?? '');
        return !empty($item->head_approval_date) && in_array($statusValue, ['review', 'pengadaan', 'pengerjaan', 'revisi', 'verifikasi']);
        });
        @endphp

        <style>
            .head-kpi-link {
                display: block;
                height: 100%;
                color: inherit;
                text-decoration: none;
                position: relative;
                z-index: 10;
            }

            .head-kpi-link:hover {
                color: inherit;
                text-decoration: none;
            }

            .head-kpi-link .card {
                height: 100%;
                cursor: pointer;
                transition: transform 0.15s ease, box-shadow 0.15s ease;
            }

            .head-kpi-link:hover .card {
                transform: translateY(-2px);
                box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
            }
        </style>

        {{-- Summary Cards --}}
        <div class="row mb-4">
            <div class="col-xl-3 col-sm-6 mb-xl-0 mb-4">
                <a href="#list_head_pending" class="head-kpi-link" aria-label="Buka daftar pending approval">
                    <div class="card">
                        <div class="card-body p-3">
                            <div class="row">
                                <div class="col-8">
                                    <div class="numbers">
                                        <p class="text-sm mb-0 text-uppercase font-weight-bold">Pending Approval</p>
                                        <h5 class="font-weight-bolder mb-0">{{ $pendingItems->count() }}</h5>
                                    </div>
                                </div>
                                <div class="col-4 text-end">
                                    <div class="icon icon-shape bg-primary shadow-primary text-center rounded-circle">
                                        <i class="fas fa-clock text-lg opacity-10" aria-hidden="true"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </a>
            </div>
            <div class="col-xl-3 col-sm-6 mb-xl-0 mb-4">
                <a href="#list_head_tracking" class="head-kpi-link" aria-label="Buka tracking approved">
                    <div class="card">
                        <div class="card-body p-3">
                            <div class="row">
                                <div class="col-8">
                                    <div class="numbers">
                                        <p class="text-sm mb-0 text-uppercase font-weight-bold">Approved</p>
                                        <h5 class="font-weight-bolder mb-0">{{ $approvedCount }}</h5>
                                    </div>
                                </div>
                                <div class="col-4 text-end">
                                    <div class="icon icon-shape bg-primary shadow-primary text-center rounded-circle">
                                        <i class="fas fa-check text-lg opacity-10" aria-hidden="true"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </a>
            </div>
            <div class="col-xl-3 col-sm-6 mb-xl-0 mb-4">
                <a href="{{ url($headHistoryRoute) . '?status=rejected' }}" class="head-kpi-link" aria-label="Buka history rejected">
                    <div class="card">
                        <div class="card-body p-3">
                            <div class="row">
                                <div class="col-8">
                                    <div class="numbers">
                                        <p class="text-sm mb-0 text-uppercase font-weight-bold">Rejected</p>
                                        <h5 class="font-weight-bolder mb-0">{{ $rejectedCount }}</h5>
                                    </div>
                                </div>
                                <div class="col-4 text-end">
                                    <div class="icon icon-shape bg-primary shadow-primary text-center rounded-circle">
                                        <i class="fas fa-times text-lg opacity-10" aria-hidden="true"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </a>
            </div>
            <div class="col-xl-3 col-sm-6">
                <a href="{{ url($headHistoryRoute) . '?status=completed' }}" class="head-kpi-link" aria-label="Buka history completed">
                    <div class="card">
                        <div class="card-body p-3">
                            <div class="row">
                                <div class="col-8">
                                    <div class="numbers">
                                        <p class="text-sm mb-0 text-uppercase font-weight-bold">Completed</p>
                                        <h5 class="font-weight-bolder mb-0">{{ $completedCount }}</h5>
                                    </div>
                                </div>
                                <div class="col-4 text-end">
                                    <div class="icon icon-shape bg-primary shadow-primary text-center rounded-circle">
                                        <i class="fas fa-check-circle text-lg opacity-10" aria-hidden="true"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </a>
            </div>
        </div>

        {{-- Section Head Approval - Pending Items --}}
        <div class="card mb-4">
            <div class="card-header pb-3">
                <div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center">
                    <h5 class="mb-1">Daftar Pengajuan Baru</h5>
                    <span class="text-muted small">Approval Head</span>
                </div>
            </div>
            <div class="table-responsive">
                <table id="list_head_pending" class="table pu-table align-items-center mb-0">
                    <thead class="thead-light pu-thead-teal">
                        <tr>
                            <th class="text-xs text-center">Aksi</th>
                            <th class="text-xs">ID Trans</th>
                            <th class="text-xs">Tanggal Pengajuan</th>
                            <th class="text-xs">Area</th>
                            <th class="text-xs">Deskripsi</th>
                            <th class="text-xs">Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse ($pendingItems as $detail)
                        @php
                        $primary = '';
                        if (isset($table_primary_d) && count($table_primary_d) > 0) {
                        foreach ($table_primary_d as $p) {
                        $primary = $primary == '' ? $detail->{$p->field} : $primary . ':' . $detail->{$p->field};
                        }
                        }
                        if ($primary == '' && isset($detail->id)) {
                        $primary = $detail->id;
                        }
                        $rawStatus = $detail->request_status ?? $detail->status ?? '';
                        $status = strtolower($rawStatus);
                        if (in_array($status, ['approved'], true)) {
                        $status = 'review';
                        } elseif ($status === 'reject') {
                        $status = 'rejected';
                        } elseif (in_array($status, ['canceled', 'cancelled'], true)) {
                        $status = 'cancel';
                        }
                        $badgeClass = 'status-badge status-' . ($status ?: 'pending');
                        $dateValue = $detail->created_at ?? $detail->tanggal ?? $detail->date ?? null;
                        $displayDate = $dateValue
                        ? \Illuminate\Support\Carbon::parse($dateValue)->format('d-m-Y')
                        : '-';
                        @endphp
                        <tr>
                            <td class="text-center">
                                <div class="btn-group">
                                    {{-- Button View --}}
                                    <button class="btn btn-primary btn-sm mb-0 px-3" type="button"
                                        title="View Data"
                                        onclick="window.location='{{ url($headRoute . '/show' . '/' . encrypt($primary)) }}'">
                                        <i class="fas fa-eye"></i><span class="font-weight-bold"> View</span>
                                    </button>

                                    {{-- Button Toggle --}}
                                    <button type="button"
                                        class="btn btn-sm btn-primary mb-0 px-2 dropdown-toggle dropdown-toggle-split"
                                        data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="visually-hidden">Toggle Dropdown</span>
                                    </button>

                                    <ul class="dropdown-menu dropdown-menu-end">
                                        {{-- Button Setujui --}}
                                        <li>
                                            <hr class="dropdown-divider">
                                        </li>
                                        <button class="btn btn-sm btn-success mx-2 mb-0 w-90"
                                            type="button"
                                            title="Setujui Data"
                                            data-bs-toggle="modal" data-bs-target="#headActionModal"
                                            data-action="Approve" data-id="{{ $primary }}">
                                            <i class="fas fa-check"></i><span class="font-weight-bold"> Setujui</span>
                                        </button>

                                        {{-- Button Tolak --}}
                                        <li>
                                            <hr class="dropdown-divider">
                                        </li>
                                        <button class="btn btn-sm btn-danger mx-2 mb-0 w-90"
                                            type="button"
                                            title="Tolak Data"
                                            data-bs-toggle="modal" data-bs-target="#headActionModal"
                                            data-action="Reject" data-id="{{ $primary }}">
                                            <i class="fas fa-times"></i><span class="font-weight-bold"> Tolak</span>
                                        </button>

                                        {{-- Penutup Divider --}}
                                        <li>
                                            <hr class="dropdown-divider">
                                        </li>
                                    </ul>
                                </div>
                            </td>
                            <td class="text-sm font-weight-bold text-primary">{{ $detail->id_trans ?: '-' }}</td>
                            <td class="text-sm">{{ $displayDate }}</td>
                            <td class="text-sm">{{ $detail->area_name ?? $detail->area ?? $detail->area_id ?? '-' }}</td>
                            <td class="text-sm">{{ $detail->job_description ?? $detail->description ?? '-' }}</td>
                            <td class="text-sm">
                                <span class="{{ $badgeClass }}">{{ $status ?: 'pending' }}</span>
                            </td>
                        </tr>
                        @empty
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        {{-- Section Head Tracking Items --}}
        <div class="card pu-table-card mb-4">
            <div class="card-header border-0 pb-0">
                <div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center">
                    <h5 class="mb-1 text-dark">Tracking Status Pekerjaan</h5>
                    <span class="text-muted small">Pekerjaan yang sedang berjalan</span>
                </div>
            </div>
            <div class="table-responsive">
                <table id="list_head_tracking" class="table pu-table align-items-center mb-0">
                    <thead class="thead-light pu-thead-teal">
                        <tr>
                            <th class="text-xs text-center" style="width: 100px;">Aksi</th>
                            <th class="text-xs" style="width: 150px;">Area</th>
                            <th class="text-xs" style="width: 250px;">Deskripsi</th>
                            <th class="text-xs">Progress</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($trackingItems as $detail)
                        @php
                        $primary = '';
                        if (isset($table_primary_d) && count($table_primary_d) > 0) {
                        foreach ($table_primary_d as $p) {
                        $primary = $primary == '' ? $detail->{$p->field} : $primary . ':' . $detail->{$p->field};
                        }
                        }
                        if ($primary == '' && isset($detail->id)) {
                        $primary = $detail->id;
                        }

                        $rawStatus = $detail->request_status ?? $detail->status ?? '';
                        $status = strtolower($rawStatus);

                        $datePending = $detail->created_at ? \Illuminate\Support\Carbon::parse($detail->created_at)->format('d/m/Y') : '-';
                        $dateReview = $detail->head_approval_date ? \Illuminate\Support\Carbon::parse($detail->head_approval_date)->format('d/m/Y') : '-';
                        $datePengadaan = (!empty($detail->pengadaan_started_at) && $detail->pengadaan_started_at !== '0000-00-00 00:00:00') ? \Illuminate\Support\Carbon::parse($detail->pengadaan_started_at)->format('d/m/Y') : '-';
                        $datePengerjaan = (!empty($detail->pengerjaan_started_at) && $detail->pengerjaan_started_at !== '0000-00-00 00:00:00') ? \Illuminate\Support\Carbon::parse($detail->pengerjaan_started_at)->format('d/m/Y') : '-';

                        $isPengadaanDone = in_array($status, ['pengadaan', 'pengerjaan', 'revisi', 'verifikasi', 'completed']) || (!empty($detail->pengadaan_started_at) && $detail->pengadaan_started_at !== '0000-00-00 00:00:00');
                        $isPengerjaanDone = in_array($status, ['pengerjaan', 'revisi', 'verifikasi', 'completed']) || (!empty($detail->pengerjaan_started_at) && $detail->pengerjaan_started_at !== '0000-00-00 00:00:00');
                        $isCompleteDone = in_array($status, ['verifikasi', 'completed']);
                        $isRejected = in_array($status, ['reject', 'rejected', 'cancel', 'canceled', 'cancelled']);

                        // Determine current status step
                        $currentStep = 'review';
                        if ($isRejected) $currentStep = 'rejected';
                        elseif (in_array($status, ['pengadaan'])) $currentStep = 'pengadaan';
                        elseif (in_array($status, ['pengerjaan', 'revisi'])) $currentStep = 'pengerjaan';
                        elseif (in_array($status, ['verifikasi', 'completed'])) $currentStep = 'complete';
                        @endphp
                        <tr>
                            <td class="text-center">
                                <button class="btn btn-primary btn-sm mb-0 px-3" type="button"
                                    title="View Data"
                                    onclick="window.location='{{ url($headRoute . '/show' . '/' . encrypt($primary)) }}'">
                                    <i class="fas fa-eye"></i><span class="font-weight-bold"> View</span>
                                </button>
                            </td>
                            <td class="text-sm">{{ $detail->area_name ?? $detail->area ?? $detail->area_id ?? '-' }}</td>
                            <td class="text-sm">{{ $detail->job_description ?? $detail->description ?? '-' }}</td>
                            <td>
                                @if($isRejected)
                                <span class="badge bg-danger">Ditolak / Dibatalkan</span>
                                @else
                                <div class="tracker-container">
                                    <!-- Step 1: Pending -->
                                    <div class="tracker-step completed">
                                        <div class="step-icon"><i class="fas fa-check"></i></div>
                                        <div class="step-label">Pending</div>
                                        <span class="step-date">{{ $datePending }}</span>
                                    </div>
                                    <!-- Step 2: Review -->
                                    <div class="tracker-step {{ $currentStep == 'review' ? 'current' : ($isPengadaanDone ? 'completed' : '') }}">
                                        <div class="step-icon"><i class="fas {{ $isPengadaanDone ? 'fa-check' : 'fa-clipboard-check' }}"></i></div>
                                        <div class="step-label">Review</div>
                                        <span class="step-date">{{ $dateReview }}</span>
                                    </div>
                                    <!-- Step 3: Pengadaan -->
                                    <div class="tracker-step {{ $currentStep == 'pengadaan' ? 'current' : ($isPengerjaanDone ? 'completed' : '') }}">
                                        <div class="step-icon"><i class="fas {{ $isPengerjaanDone ? 'fa-check' : 'fa-box' }}"></i></div>
                                        <div class="step-label">Pengadaan</div>
                                        <span class="step-date">{{ $datePengadaan !== '-' ? $datePengadaan : ($currentStep == 'pengadaan' ? 'Proses...' : '-') }}</span>
                                    </div>
                                    <!-- Step 4: Pengerjaan -->
                                    <div class="tracker-step {{ $currentStep == 'pengerjaan' ? 'current' : ($isCompleteDone ? 'completed' : '') }}">
                                        <div class="step-icon"><i class="fas {{ $isCompleteDone ? 'fa-check' : 'fa-tools' }}"></i></div>
                                        <div class="step-label">Pengerjaan</div>
                                        <span class="step-date">{{ $datePengerjaan !== '-' ? $datePengerjaan : ($currentStep == 'pengerjaan' ? 'Proses...' : '-') }}</span>
                                    </div>
                                    <!-- Step 5: Complete -->
                                    <div class="tracker-step {{ $currentStep == 'complete' ? 'current' : '' }}">
                                        <div class="step-icon"><i class="fas {{ $currentStep == 'complete' ? 'fa-check' : 'fa-flag-checkered' }}"></i></div>
                                        <div class="step-label">Complete</div>
                                        <span class="step-date">-</span>
                                    </div>
                                </div>
                                @endif
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>

        {{-- Verifikasi Pekerjaan removed from head partial (should be shown only in user/hrd views) --}}




        <div class="modal fade" id="trreqVerifyModal" tabindex="-1" aria-labelledby="trreqVerifyModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <form method="POST" action="{{ route('work-schedule.verify') }}" enctype="multipart/form-data">
                        @csrf
                        <div class="modal-header">
                            <h5 class="modal-title" id="trreqVerifyModalLabel">Verifikasi Pekerjaan</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                            <input type="hidden" name="non_periodic_id" id="trreq-verify-non-periodic-id" value="">
                            <input type="hidden" name="decision" id="trreq-verify-decision" value="">
                            <div class="mb-3">
                                <label class="form-label" id="trreq-verify-notes-label">Catatan</label>
                                <textarea class="form-control" name="notes" id="trreq-verify-notes" rows="3" placeholder="Tulis catatan jika diperlukan"></textarea>
                            </div>
                            <div class="mb-3" id="trreq-verify-attachment-wrapper" style="display: none;">
                                <label class="form-label" for="trreq-verify-attachments">Lampiran Revisi</label>
                                <input class="form-control" type="file" name="revision_attachments[]" id="trreq-verify-attachments" accept=".jpg,.jpeg,.png,.webp,.jfif,.heic,.heif,.pdf" multiple>
                                <small class="text-muted">Format: JPG, PNG, WEBP, HEIC, PDF (maks 5MB/file)</small>
                            </div>
                            <div class="alert alert-info mb-0">
                                <small>
                                    <strong>Setuju:</strong> Pekerjaan akan ditandai selesai.<br>
                                    <strong>Revisi:</strong> Pekerjaan akan dikembalikan ke petugas untuk perbaikan.
                                </small>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                            <button type="submit" class="btn btn-primary" id="trreqVerifySubmit">Setujui</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <div class="modal fade" id="headActionModal" tabindex="-1" aria-labelledby="headActionLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <form method="POST" action="{{ url('/pengajuan-head/update') }}">
                        @csrf
                        <div class="modal-header">
                            <h5 class="modal-title" id="headActionLabel">Approval Head</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                            <input type="hidden" name="id" id="head-request-id" value="">
                            <input type="hidden" name="request_status" id="head-request-status" value="review">
                            <input type="hidden" name="return_url" value="{{ request()->fullUrlWithQuery(['tab' => 'trreq']) }}">
                            <div class="mb-3">
                                <label class="form-label" id="head-note-label">Catatan</label>
                                <textarea class="form-control" name="head_note" id="head-note-input" rows="3" placeholder="Tulis catatan"></textarea>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                            <button type="submit" class="btn btn-primary" id="headActionSubmit">Approve</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        @push('js')
        <script>
            const headActionModal = document.getElementById('headActionModal');
            if (headActionModal) {
                headActionModal.addEventListener('show.bs.modal', function(event) {
                    const button = event.relatedTarget;
                    const action = button.getAttribute('data-action') || 'Approve';
                    const title = action === 'Reject' ? 'Catatan Penolakan' : 'Catatan Persetujuan';
                    const submit = document.getElementById('headActionSubmit');
                    const label = document.getElementById('headActionLabel');
                    const inputId = document.getElementById('head-request-id');
                    const inputStatus = document.getElementById('head-request-status');
                    const noteInput = document.getElementById('head-note-input');
                    const noteLabel = document.getElementById('head-note-label');

                    if (label) {
                        label.textContent = title;
                    }
                    if (submit) {
                        submit.textContent = action === 'Reject' ? 'Tolak' : 'Setujui';
                    }
                    if (inputId) {
                        inputId.value = button.getAttribute('data-id') || '';
                    }
                    if (inputStatus) {
                        inputStatus.value = action === 'Reject' ? 'rejected' : 'review';
                    }
                    if (noteInput) {
                        noteInput.value = '';
                        noteInput.required = action === 'Reject';
                    }
                    if (noteLabel) {
                        noteLabel.textContent = action === 'Reject' ? 'Catatan (wajib diisi)' : 'Catatan';
                    }
                });
            }

            if ($.fn.DataTable) {
                if (!$.fn.DataTable.isDataTable('#list_head_pending')) {
                    $('#list_head_pending').DataTable({
                        pageLength: 10,
                        info: false,
                        searching: true,
                        responsive: true,
                        language: {
                            search: "Cari :",
                            lengthMenu: "Tampilkan _MENU_ baris",
                            zeroRecords: "Maaf - Data tidak ada",
                            info: "Data _START_ - _END_ dari _TOTAL_",
                            infoEmpty: "Tidak ada data",
                            infoFiltered: "(pencarian dari _MAX_ data)"
                        },
                        responsive: true,
                    });
                }

                if (!$.fn.DataTable.isDataTable('#list_head_tracking')) {
                    $('#list_head_tracking').DataTable({
                        pageLength: 10,
                        info: false,
                        searching: true,
                        responsive: true,
                        language: {
                            search: "Cari :",
                            lengthMenu: "Tampilkan _MENU_ baris",
                            zeroRecords: "Maaf - Data tidak ada",
                            info: "Data _START_ - _END_ dari _TOTAL_",
                            infoEmpty: "Tidak ada data",
                            infoFiltered: "(pencarian dari _MAX_ data)"
                        },
                        responsive: true,
                    });
                }

                if (!$.fn.DataTable.isDataTable('#list_head_verifikasi')) {
                    $('#list_head_verifikasi').DataTable({
                        pageLength: 10,
                        ordering: true,
                        info: true,
                        searching: true,
                        order: [
                            [1, 'desc']
                        ],
                        columnDefs: [{
                            targets: 0,
                            orderable: false,
                            searchable: false
                        }]
                    });
                }
            }

            const trreqVerifyModal = document.getElementById('trreqVerifyModal');
            if (trreqVerifyModal) {
                trreqVerifyModal.addEventListener('show.bs.modal', function(event) {
                    const button = event.relatedTarget;
                    const action = button.getAttribute('data-action') || 'approve';
                    const nonPeriodicId = button.getAttribute('data-non-periodic-id') || '';

                    const modalTitle = document.getElementById('trreqVerifyModalLabel');
                    const submitBtn = document.getElementById('trreqVerifySubmit');
                    const decisionInput = document.getElementById('trreq-verify-decision');
                    const nonPeriodicIdInput = document.getElementById('trreq-verify-non-periodic-id');
                    const notesInput = document.getElementById('trreq-verify-notes');
                    const notesLabel = document.getElementById('trreq-verify-notes-label');
                    const revisionAttachmentWrapper = document.getElementById('trreq-verify-attachment-wrapper');
                    const revisionAttachmentInput = document.getElementById('trreq-verify-attachments');

                    if (action === 'approve') {
                        modalTitle.textContent = 'Setujui Pekerjaan';
                        submitBtn.textContent = 'Setujui';
                        submitBtn.className = 'btn btn-success';
                        decisionInput.value = 'approve';
                        if (notesLabel) notesLabel.textContent = 'Catatan';
                        if (notesInput) notesInput.required = false;
                        if (revisionAttachmentWrapper) revisionAttachmentWrapper.style.display = 'none';
                    } else {
                        modalTitle.textContent = 'Minta Revisi';
                        submitBtn.textContent = 'Minta Revisi';
                        submitBtn.className = 'btn btn-warning';
                        decisionInput.value = 'reject';
                        if (notesLabel) notesLabel.textContent = 'Catatan (wajib diisi)';
                        if (notesInput) notesInput.required = true;
                        if (revisionAttachmentWrapper) revisionAttachmentWrapper.style.display = '';
                    }

                    nonPeriodicIdInput.value = nonPeriodicId;
                    if (notesInput) notesInput.value = '';
                    if (revisionAttachmentInput) revisionAttachmentInput.value = '';
                });
            }
        </script>
        @endpush