@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])
@section('content')
    <style>
        .sticky-th {
            position: sticky;
            top: 0;
            z-index: 10;
            background-color: #b2ebf2;
            /* warna solid pengganti #00b7bd4f yang transparan */
        }
    </style>
    @include('layouts.navbars.auth.topnav', ['title' => ''])

    <div class="container-fluid py-4">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <div class="d-flex justify-content-between align-items-center">
                            <h5 class="mb-0">Review DKL Personalia</h5>
                            <div class="d-flex gap-2">
                                @if (($canEditDkl ?? true) && in_array($dkl->status, ['draft', 'pending_atasan', 'pending_personalia']))
                                    <a href="{{ url('txrdkl/edit/' . encrypt($dkl->id)) }}" class="btn btn-sm btn-warning">
                                        <i class="fas fa-edit me-1"></i> Edit DKL
                                    </a>
                                @endif
                                <a href="{{ url($url_menu) }}" class="btn btn-sm btn-outline-secondary">
                                    <i class="fas fa-arrow-left me-1"></i> Kembali
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        @include('components.alert')

                        {{-- ====== HEADER DKL ====== --}}
                        <div class="card mb-4 border">
                            <div class="card-header bg-light">
                                <h6 class="mb-0">Header DKL</h6>
                            </div>
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-md-3 mb-3">
                                        <label class="form-label fw-bold">No DKL</label>
                                        <p class="form-control-plaintext">{{ $dkl->no_dkl }}</p>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="form-label fw-bold">No SPL (Referensi)</label>
                                        <p class="form-control-plaintext">{{ $dkl->no_spl }}</p>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="form-label fw-bold">Tanggal DKL</label>
                                        <p class="form-control-plaintext">
                                            {{ \Carbon\Carbon::parse($dkl->tanggal_dkl)->format('j-M-Y') }}</p>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="form-label fw-bold">Status</label>
                                        <p class="form-control-plaintext">
                                            @php
                                                $statusBadge = [
                                                    'draft' => 'bg-secondary',
                                                    'pending_atasan' => 'bg-warning text-white',
                                                    'approved_atasan' => 'bg-success',
                                                    'pending_personalia' => 'bg-info text-white',
                                                    'approved_personalia' => 'bg-primary',
                                                    'rejected_personalia' => 'bg-danger',
                                                    'rejected_atasan' => 'bg-danger',
                                                ];
                                            @endphp
                                            <span class="badge {{ $statusBadge[$dkl->status] ?? 'bg-secondary' }}">
                                                {{ strtoupper(str_replace('_', ' ', $dkl->status)) }}
                                            </span>
                                        </p>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-3 mb-3">
                                        <label class="form-label fw-bold">NIK Pemohon</label>
                                        <p class="form-control-plaintext">{{ $dkl->nik }}</p>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="form-label fw-bold">Nama Pemohon</label>
                                        <p class="form-control-plaintext">{{ $pemohon->nama ?? '-' }}</p>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="form-label fw-bold">Departemen</label>
                                        <p class="form-control-plaintext">{{ $departemen->nama ?? '-' }}</p>
                                    </div>
                                    <div class="col-md-3 mb-3">
                                        <label class="form-label fw-bold">Approver</label>
                                        <p class="form-control-plaintext">{{ $approver_name ?? '-' }}</p>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12 mb-3">
                                        <label class="form-label fw-bold">Keterangan</label>
                                        <p class="form-control-plaintext">{{ $dkl->keterangan ?: '-' }}</p>
                                    </div>
                                </div>
                            </div>
                        </div>

                        {{-- ====== COMPARISON: SPL vs DKL ====== --}}
                        <div class="card mb-4 border">
                            <div class="card-header bg-light">
                                <div class="d-flex justify-content-between align-items-start flex-wrap gap-2">
                                    <div>
                                        <h6 class="mb-0">Perbandingan: SPL (Rencana) vs DKL (Realisasi)</h6>
                                        <div class="mt-1">
                                            <small class="text-muted">
                                                <span class="text-danger fw-bold">Merah</span> menandakan jam DKL yang
                                                diedit atau berbeda dari SPL.
                                            </small>
                                        </div>
                                    </div>
                                    <div class="d-flex flex-column align-items-end gap-2">
                                        <div class="d-flex align-items-center gap-1">
                                            <span class="badge bg-primary">Biru = SPL (Rencana)</span>
                                            <span class="badge bg-success">Hijau = DKL (Aktual)</span>
                                            <span class="badge bg-danger">Merah = DKL (Ditolak)</span>
                                        </div>
                                        <div>
                                            @if ($check_rejected)
                                                <button type="button" id="btnToggleRejected"
                                                    class="btn btn-sm btn-info text-white mb-0"
                                                    onclick="toggleRejectedRows()">
                                                    <i class="fas fa-list me-1"></i> <span id="btnToggleText">Tampilkan
                                                        Semua Data</span>
                                                </button>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="table-responsive"
                                    style="max-height: 550px; overflow-y: auto; overflow-x: auto;">
                                    <table class="table table-bordered" style="min-width:1600px;">
                                        <thead>
                                            <tr>
                                                <th width="40px" class="sticky-th">No</th>
                                                <th width="100px" class="sticky-th">NIK</th>
                                                <th width="140px" class="sticky-th">Nama</th>
                                                <th width="110px" class="sticky-th">Tgl Lembur</th>
                                                <th width="200px" class="sticky-th">Agenda</th>
                                                <th width="130px" class="sticky-th">From</th>
                                                <th width="130px" class="sticky-th">To</th>
                                                <th width="100px" class="sticky-th">Break</th>
                                                <th width="100px" class="sticky-th">Hour</th>
                                                <th width="170px" class="sticky-th">Status Pekerjaan</th>
                                                <th width="160px" class="sticky-th">Jenis</th>
                                                <th width="160px" class="sticky-th">Tipe</th>
                                                <th width="200px" class="sticky-th">Alasan</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @forelse ($dkl_details as $idx => $dklDetail)
                                                @php
                                                    $splDetail = isset($spl_details)
                                                        ? $spl_details->get($dklDetail->id_spl_detail)
                                                        : null;

                                                    // 1. Cek status reject masing-masing
                                                    $isRejectedDkl = in_array($dklDetail->status, [
                                                        'rejected_atasan',
                                                        'rejected_personalia',
                                                        'rejected',
                                                    ]);
                                                    $isRejectedSpl =
                                                        isset($spl) &&
                                                        !empty($spl->status) &&
                                                        in_array($spl->status, [
                                                            'rejected',
                                                            'rejected_atasan',
                                                            'rejected_personalia',
                                                        ]);

                                                    // Flag untuk styling baris (jika DKL reject, baris DKL jadi merah)
                                                    $splBgColor = $isRejectedSpl ? '#f8d7da' : '#e3f2fd';
                                                    $dklBgColor = $isRejectedDkl
                                                        ? '#f5c2c7'
                                                        : ($splDetail
                                                            ? '#e8f5e9'
                                                            : '#ffffff');

                                                    $diffFrom =
                                                        $splDetail && $splDetail->jam_mulai != $dklDetail->jam_mulai;
                                                    $diffTo =
                                                        $splDetail &&
                                                        $splDetail->jam_selesai != $dklDetail->jam_selesai;
                                                    $diffBreak =
                                                        $splDetail && $splDetail->break_jam != $dklDetail->break_jam;
                                                    $diffHour =
                                                        $splDetail && $splDetail->jam_lembur != $dklDetail->jam_lembur;
                                                    $diffAgenda =
                                                        $splDetail && $splDetail->agenda != $dklDetail->agenda;
                                                    $diffJenis =
                                                        $splDetail &&
                                                        $splDetail->id_jenis_lembur != $dklDetail->id_jenis_lembur;
                                                    $diffTipe =
                                                        $splDetail &&
                                                        $splDetail->id_tipe_lembur != $dklDetail->id_tipe_lembur;
                                                @endphp

                                                {{-- SPL Row (Rencana) --}}
                                                @if ($splDetail)
                                                    <tr class="row-pair-spl {{ $isRejectedDkl || $isRejectedSpl ? 'row-rejected' : 'row-approved' }}"
                                                        data-jam-spl="{{ (float) $splDetail->jam_lembur }}"
                                                        data-is-rejected-spl="{{ $isRejectedSpl ? '1' : '0' }}"
                                                        style="background-color: {{ $splBgColor }}; {{ $isRejectedDkl || $isRejectedSpl ? 'display: none;' : '' }}">
                                                        <td rowspan="2" class="text-center align-middle row-number">
                                                        </td>
                                                        <td rowspan="2" class="align-middle">
                                                            {{ $dklDetail->nik }}
                                                            @if ($isRejectedDkl)
                                                                <br><span class="badge bg-danger mt-1">REJECTED</span>
                                                            @endif
                                                        </td>
                                                        <td rowspan="2" class="align-middle">
                                                            {{ $karyawan_map[$dklDetail->nik] ?? '-' }}</td>
                                                        <td rowspan="2" class="align-middle">
                                                            {{ \Carbon\Carbon::parse($dklDetail->tanggal_lembur)->format('j-M-Y') }}
                                                        </td>
                                                        <td>
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            {{ $splDetail->agenda }}
                                                        </td>
                                                        <td>
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            {{ $splDetail->jam_mulai }}
                                                        </td>
                                                        <td>
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            {{ $splDetail->jam_selesai }}
                                                        </td>
                                                        <td class="text-center">
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            {{ $splDetail->break_jam }}
                                                        </td>
                                                        <td class="text-center">
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            {{ $splDetail->jam_lembur }}
                                                        </td>
                                                        <td class="text-center">
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            -
                                                        </td>
                                                        <td>
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            {{ isset($jenis_lembur[$splDetail->id_jenis_lembur]) ? $jenis_lembur[$splDetail->id_jenis_lembur]->nama : '-' }}
                                                        </td>
                                                        <td>
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            {{ isset($tipe_lembur[$splDetail->id_tipe_lembur]) ? $tipe_lembur[$splDetail->id_tipe_lembur]->nama : '-' }}
                                                        </td>
                                                        <td>
                                                            <small class="text-primary fw-bold">SPL:</small><br>
                                                            -
                                                        </td>
                                                    </tr>
                                                @endif

                                                {{-- DKL Row (Realisasi) --}}
                                                <tr class="row-pair-dkl {{ $isRejectedDkl || $isRejectedSpl ? 'row-rejected' : 'row-approved' }}"
                                                    data-jam-dkl="{{ (float) $dklDetail->jam_lembur }}"
                                                    data-is-rejected-dkl="{{ $isRejectedDkl ? '1' : '0' }}"
                                                    style="background-color: {{ $dklBgColor }}; {{ $isRejectedDkl || $isRejectedSpl ? 'display: none;' : '' }}">
                                                    @if (!$splDetail)
                                                        <td class="text-center align-middle row-number"></td>
                                                        <td class="align-middle">
                                                            {{ $dklDetail->nik }}
                                                            @if ($isRejectedDkl)
                                                                <br><span class="badge bg-danger mt-1">REJECTED</span>
                                                            @endif
                                                        </td>
                                                        <td class="align-middle">
                                                            {{ $karyawan_map[$dklDetail->nik] ?? '-' }}</td>
                                                        <td class="align-middle">
                                                            {{ \Carbon\Carbon::parse($dklDetail->tanggal_lembur)->format('j-M-Y') }}
                                                        </td>
                                                    @endif
                                                    <td class="{{ $diffAgenda ? 'text-danger fw-bold' : '' }}">
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        {{ $dklDetail->agenda }}
                                                    </td>
                                                    <td class="{{ $diffFrom ? 'text-danger fw-bold' : '' }}">
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        {{ $dklDetail->jam_mulai }}
                                                    </td>
                                                    <td class="{{ $diffTo ? 'text-danger fw-bold' : '' }}">
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        {{ $dklDetail->jam_selesai }}
                                                    </td>
                                                    <td class="text-center {{ $diffBreak ? 'text-danger fw-bold' : '' }}">
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        {{ $dklDetail->break_jam }}
                                                    </td>
                                                    <td class="text-center {{ $diffHour ? 'text-danger fw-bold' : '' }}">
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        <span class="fw-bold">{{ $dklDetail->jam_lembur }}</span>
                                                    </td>
                                                    <td class="text-center">
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        @if (($dklDetail->pekerjaan_selesai ?? 'belum') == 'sudah')
                                                            <span
                                                                class="badge rounded-pill bg-success-subtle text-success border border-success-subtle">Sudah
                                                                Selesai</span>
                                                        @elseif (($dklDetail->pekerjaan_selesai ?? 'belum') == 'tidak')
                                                            <span
                                                                class="badge rounded-pill bg-danger-subtle text-danger border border-danger-subtle">Tidak
                                                                Selesai</span>
                                                        @else
                                                            <span
                                                                class="badge rounded-pill bg-warning-subtle text-warning border border-warning-subtle">Belum
                                                                Selesai</span>
                                                        @endif
                                                    </td>
                                                    <td class="{{ $diffJenis ? 'text-danger fw-bold' : '' }}">
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        {{ isset($jenis_lembur[$dklDetail->id_jenis_lembur]) ? $jenis_lembur[$dklDetail->id_jenis_lembur]->nama : '-' }}
                                                    </td>
                                                    <td class="{{ $diffTipe ? 'text-danger fw-bold' : '' }}">
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        {{ isset($tipe_lembur[$dklDetail->id_tipe_lembur]) ? $tipe_lembur[$dklDetail->id_tipe_lembur]->nama : '-' }}
                                                    </td>
                                                    <td>
                                                        <small
                                                            class="{{ $isRejectedDkl ? 'text-danger' : 'text-success' }} fw-bold">DKL:</small><br>
                                                        @php
                                                            $alasanVal =
                                                                $dklDetail->catatan_atasan ?:
                                                                ($dklDetail->catatan_personalia ?:
                                                                ($dkl->catatan_atasan ?:
                                                                '-'));
                                                        @endphp
                                                        <span class="{{ $isRejectedDkl ? 'fw-bold text-danger' : '' }}">
                                                            {{ $alasanVal }}
                                                        </span>
                                                    </td>
                                                </tr>
                                            @empty
                                                <tr>
                                                    <td colspan="13" class="text-center text-muted">Tidak ada detail
                                                        lembur.</td>
                                                </tr>
                                            @endforelse
                                        </tbody>
                                        {{-- @if ($dkl_details->count() > 0)
                                            <tfoot>
                                                <tr class="fw-bold" style="background-color: #f0f0f0;">
                                                    <td colspan="8" class="text-end">Total Jam Lembur (DKL):</td>
                                                    <td class="text-center" id="totalJamLembur">0</td>
                                                    <td colspan="4"></td>
                                                </tr>
                                            </tfoot>
                                        @endif --}}
                                        @if ($dkl_details->count() > 0)
                                            <tfoot>
                                                <tr class="fw-bold" style="background-color: #e8f4fd;">
                                                    <td colspan="8" class="text-end text-primary">Total Jam Lembur (SPL
                                                        / Rencana):</td>
                                                    <td class="text-center text-primary" id="totalJamSpl">0</td>
                                                    <td colspan="4"></td>
                                                </tr>
                                                <tr class="fw-bold" style="background-color: #f0fdf4;">
                                                    <td colspan="8" class="text-end text-success">Total Jam Lembur (DKL
                                                        / Realisasi):</td>
                                                    <td class="text-center text-success" id="totalJamDkl">0</td>
                                                    <td colspan="4"></td>
                                                </tr>
                                            </tfoot>
                                        @endif
                                    </table>
                                </div>
                            </div>
                        </div>

                        {{-- ====== APPROVAL INFO (if already processed) ====== --}}
                        @if ($dkl->status != 'pending_atasan')
                            <div class="card mb-4 border">
                                <div class="card-header bg-light">
                                    <h6 class="mb-0">Informasi Approval Atasan</h6>
                                </div>
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <table class="table table-sm table-borderless">
                                                <tr>
                                                    <td width="150">Status</td>
                                                    <td>:
                                                        @if (in_array($dkl->status, ['approved_atasan', 'pending_personalia', 'approved_personalia', 'rejected_personalia']))
                                                            <span class="badge bg-success">Approved</span>
                                                        @elseif ($dkl->status == 'rejected_atasan')
                                                            <span class="badge bg-danger">Rejected</span>
                                                        @else
                                                            <span class="badge bg-secondary">-</span>
                                                        @endif
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Diproses Oleh</td>
                                                    <td>:
                                                        {{ \App\Helpers\Format_Helper::getNameAndUsername($dkl->approved_atasan_by) }}
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Tanggal</td>
                                                    <td>:
                                                        {{ $dkl->approved_atasan_at ? \Carbon\Carbon::parse($dkl->approved_atasan_at)->format('j-M-Y H:i') : '-' }}
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Catatan Atasan</td>
                                                    <td>: {{ $dkl->catatan_atasan ?: '-' }}</td>
                                                </tr>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endif

                        @if (in_array($dkl->status, ['approved_personalia', 'rejected_personalia']))
                            <div class="card mb-4 border">
                                <div class="card-header bg-light">
                                    <h6 class="mb-0">Informasi Approval Personalia</h6>
                                </div>
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <table class="table table-sm table-borderless">
                                                <tr>
                                                    <td width="150">Status</td>
                                                    <td>:
                                                        @if ($dkl->status == 'approved_personalia')
                                                            <span class="badge bg-primary">Approved Personalia</span>
                                                        @elseif ($dkl->status == 'rejected_personalia')
                                                            <span class="badge bg-danger">Rejected Personalia</span>
                                                        @endif
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Diproses Oleh</td>
                                                    <td>:
                                                        {{ \App\Helpers\Format_Helper::getNameAndUsername($dkl->approved_personalia_by) }}
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Tanggal</td>
                                                    <td>:
                                                        {{ $dkl->approved_personalia_at ? \Carbon\Carbon::parse($dkl->approved_personalia_at)->format('j-M-Y H:i') : '-' }}
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>Catatan Personalia</td>
                                                    <td>: {{ $dkl->catatan_personalia ?: '-' }}</td>
                                                </tr>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endif

                        @if ($dkl->status == 'pending_atasan' && ($canApprove ?? false))
                            <div class="card mb-4 border border-primary">
                                <div class="card-header bg-gradient-primary text-white">
                                    <h6 class="mb-0 text-white">
                                        <i class="fas fa-gavel me-2"></i>Keputusan Approval DKL
                                    </h6>
                                </div>
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-12 mb-3">
                                            <label class="form-label fw-bold">Catatan Atasan</label>
                                            <textarea class="form-control" id="catatan_atasan" rows="3" maxlength="500"
                                                placeholder="Masukkan catatan (wajib diisi saat Reject, opsional saat Approve)"></textarea>
                                            <small class="text-muted">Maksimal 500 karakter</small>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="d-flex gap-3">
                                                <form action="{{ url('/approval-dkl/approve') }}" method="POST"
                                                    id="approve-form">
                                                    @csrf
                                                    <input type="hidden" name="dkl_id" value="{{ $dkl->id }}">
                                                    <input type="hidden" name="catatan_atasan" id="catatan_approve">
                                                    <button type="button" class="btn btn-success btn-sm px-3 py-2"
                                                        onclick="confirmApprove()">
                                                        <i class="fas fa-check-circle me-2"></i> APPROVE
                                                    </button>
                                                </form>
                                                <form action="{{ url('/approval-dkl/reject') }}" method="POST"
                                                    id="reject-form">
                                                    @csrf
                                                    <input type="hidden" name="dkl_id" value="{{ $dkl->id }}">
                                                    <input type="hidden" name="catatan_atasan" id="catatan_reject">
                                                    <button type="button" class="btn btn-danger btn-sm px-3 py-2"
                                                        onclick="confirmReject()">
                                                        <i class="fas fa-times-circle me-2"></i> REJECT
                                                    </button>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endif

                        @if ($dkl->status == 'pending_personalia' && ($canApprove ?? false))
                            <div class="card mb-4 border border-primary">
                                <div class="card-header bg-gradient-primary text-white">
                                    <h6 class="mb-0 text-white">
                                        <i class="fas fa-gavel me-2"></i>Keputusan Approval Personalia
                                    </h6>
                                </div>
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-12 mb-3">
                                            <label class="form-label fw-bold">Catatan Personalia</label>
                                            <textarea class="form-control" id="catatan_personalia" rows="3" maxlength="500"
                                                placeholder="Masukkan catatan (wajib diisi saat Reject, opsional saat Approve)"></textarea>
                                            <small class="text-muted">Maksimal 500 karakter</small>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="d-flex gap-3">
                                                <form action="{{ url('/approval-dkl/approve') }}" method="POST"
                                                    id="approve-personalia-form">
                                                    @csrf
                                                    <input type="hidden" name="dkl_id" value="{{ $dkl->id }}">
                                                    <input type="hidden" name="catatan_personalia"
                                                        id="catatan_personalia_approve">
                                                    <button type="button" class="btn btn-success btn-sm px-3 py-2"
                                                        onclick="confirmPersonaliaApprove()">
                                                        <i class="fas fa-check-circle me-2"></i> APPROVE
                                                    </button>
                                                </form>

                                                <form action="{{ url('/approval-dkl/reject') }}" method="POST"
                                                    id="reject-personalia-form">
                                                    @csrf
                                                    <input type="hidden" name="dkl_id" value="{{ $dkl->id }}">
                                                    <input type="hidden" name="catatan_personalia"
                                                        id="catatan_personalia_reject">
                                                    <button type="button" class="btn btn-danger btn-sm px-3 py-2"
                                                        onclick="confirmPersonaliaReject()">
                                                        <i class="fas fa-times-circle me-2"></i> REJECT
                                                    </button>
                                                </form>

                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endif

                        {{-- Audit Info --}}
                        <div class="row">
                            <div class="col-md-6">
                                <small class="text-muted">
                                    Dibuat oleh: {{ $dkl->user_create ?? '-' }} |
                                    {{ $dkl->created_at ? \Carbon\Carbon::parse($dkl->created_at)->format('j-M-Y H:i') : '-' }}
                                </small>
                            </div>
                            <div class="col-md-6 text-end">
                                <small class="text-muted">
                                    Diupdate oleh: {{ $dkl->user_update ?? '-' }} |
                                    {{ $dkl->updated_at ? \Carbon\Carbon::parse($dkl->updated_at)->format('j-M-Y H:i') : '-' }}
                                </small>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        let isShowingAll = false;

        function reindexAndCalculateTotal() {
            let totalJamSpl = 0;
            let totalJamDkl = 0;
            let number = 1;

            // 1. Hitung total SPL (Hanya baris yang tampil dan status SPL-nya TIDAK REJECT)
            document.querySelectorAll('tr.row-pair-spl').forEach(tr => {
                if (tr.style.display !== 'none' && tr.getAttribute('data-is-rejected-spl') !== '1') {
                    const jamSpl = parseFloat(tr.getAttribute('data-jam-spl')) || 0;
                    totalJamSpl += jamSpl;
                }
            });

            // 2. Hitung total DKL (Hanya baris yang tampil dan status DKL detail-nya TIDAK REJECT)
            document.querySelectorAll('tr.row-pair-dkl').forEach(tr => {
                if (tr.style.display !== 'none' && tr.getAttribute('data-is-rejected-dkl') !== '1') {
                    const jamDkl = parseFloat(tr.getAttribute('data-jam-dkl')) || 0;
                    totalJamDkl += jamDkl;
                }
            });

            // 3. Penomoran urut baris yang sedang tampil
            document.querySelectorAll('.row-number').forEach(td => {
                const parentTr = td.closest('tr');
                if (parentTr && parentTr.style.display !== 'none') {
                    td.innerText = number++;
                }
            });

            // 4. Tampilkan total ke tfoot
            const totalSplDisplay = document.getElementById('totalJamSpl');
            if (totalSplDisplay) {
                totalSplDisplay.innerText = totalJamSpl % 1 === 0 ? totalJamSpl : totalJamSpl.toFixed(2);
            }

            const totalDklDisplay = document.getElementById('totalJamDkl');
            if (totalDklDisplay) {
                totalDklDisplay.innerText = totalJamDkl % 1 === 0 ? totalJamDkl : totalJamDkl.toFixed(2);
            }
        }


        function toggleRejectedRows() {
            isShowingAll = !isShowingAll;
            const rejectedRows = document.querySelectorAll('.row-rejected');
            const btn = document.getElementById('btnToggleRejected');
            const btnText = document.getElementById('btnToggleText');

            rejectedRows.forEach(row => {
                row.style.display = isShowingAll ? '' : 'none';
            });

            if (isShowingAll) {
                btn.classList.remove('btn-info');
                btn.classList.add('btn-outline-secondary');
                btn.innerHTML = '<i class="fas fa-filter me-1"></i> <span>Tampilkan DKL Approve</span>';
            } else {
                btn.classList.remove('btn-outline-secondary');
                btn.classList.add('btn-info');
                btn.innerHTML = '<i class="fas fa-list me-1"></i> <span>Tampilkan Semua Data</span>';
            }

            reindexAndCalculateTotal();
        }

        // Inisialisasi nomor dan total jam saat halaman pertama kali dibuka
        document.addEventListener('DOMContentLoaded', function() {
            reindexAndCalculateTotal();
        });

        function confirmApprove() {
            // Copy catatan to hidden field
            document.getElementById('catatan_approve').value = document.getElementById('catatan_atasan').value;

            // Generate HTML summary table
            const summaryHtml = `
                <p class="text-sm">Apakah Anda yakin ingin meng-APPROVE DKL <strong>{{ $dkl->no_dkl }}</strong>?</p>
                <div class="table-responsive text-start mt-3" style="max-height: 250px; overflow-y: auto; border: 1px solid #e9ecef; border-radius: 4px;">
                    <table class="table table-sm table-bordered mb-0 text-xs" style="width: 100%; border-collapse: collapse;">
                        <thead style="background-color: #f6f9fc;">
                            <tr>
                                <th class="p-2 align-middle text-start" style="font-weight: 600; color: #525f7f; border-bottom: 1px solid #e9ecef;">Nama</th>
                                <th class="p-2 align-middle text-center" style="font-weight: 600; color: #525f7f; border-bottom: 1px solid #e9ecef; width: 90px;">Total DKL</th>
                                <th class="p-2 align-middle text-center" style="font-weight: 600; color: #525f7f; border-bottom: 1px solid #e9ecef; width: 130px;">Status</th>
                            </tr>
                        </thead>
                        <tbody>
                       @foreach ($dkl_details as $dklDetail)
    @php
        $isRejectedDkl = in_array($dklDetail->status, ['rejected_atasan', 'rejected_personalia', 'rejected']);
        $isRejectedSpl = isset($spl) && in_array($spl->status ?? '', ['rejected', 'rejected_atasan', 'rejected_personalia']);
        $isRejected = $isRejectedDkl || $isRejectedSpl;
    @endphp
    
    @if (!$isRejected)
        <tr>
            <td class="p-2 align-middle text-start" style="color: #525f7f; border-bottom: 1px solid #e9ecef;">
                {{ $karyawan_map[$dklDetail->nik] ?? '-' }}
            </td>
            <td class="p-2 align-middle text-center fw-bold" style="color: #525f7f; border-bottom: 1px solid #e9ecef;">
                {{ $dklDetail->jam_lembur }} jam
            </td>
            <td class="p-2 align-middle text-center" style="border-bottom: 1px solid #e9ecef;">
                @if (($dklDetail->pekerjaan_selesai ?? 'belum') == 'sudah')
                    <span class="badge rounded-pill bg-success-subtle text-success border border-success-subtle px-2 py-1" style="font-size: 10px;">Sudah Selesai</span>
                @elseif (($dklDetail->pekerjaan_selesai ?? 'belum') == 'tidak')
                    <span class="badge rounded-pill bg-danger-subtle text-danger border border-danger-subtle px-2 py-1" style="font-size: 10px;">Tidak Selesai</span>
                @else
                    <span class="badge rounded-pill bg-warning-subtle text-warning border border-warning-subtle px-2 py-1" style="font-size: 10px;">Belum Selesai</span>
                @endif
            </td>
        </tr>
    @endif
@endforeach
                        </tbody>
                    </table>
                </div>
            `;

            Swal.fire({
                title: 'Approve DKL',
                html: summaryHtml,
                icon: 'question',
                width: '600px',
                showCancelButton: true,
                confirmButtonColor: '#2dce89',
                cancelButtonColor: '#6c757d',
                confirmButtonText: 'Ya, Approve!',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed) {
                    document.getElementById('approve-form').submit();
                }
            });
        }

        function confirmReject() {
            var catatan = document.getElementById('catatan_atasan').value;
            if (!catatan || catatan.trim() === '') {
                Swal.fire({
                    title: 'Catatan Wajib Diisi',
                    text: 'Anda harus mengisi catatan atasan saat me-reject DKL.',
                    icon: 'warning',
                    confirmButtonColor: '#028284',
                    confirmButtonText: 'OK'
                });
                document.getElementById('catatan_atasan').focus();
                return;
            }

            // Copy catatan to hidden field
            document.getElementById('catatan_reject').value = catatan;

            Swal.fire({
                title: 'Reject DKL',
                text: 'Apakah Anda yakin ingin me-REJECT DKL {{ $dkl->no_dkl }}?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#f5365c',
                cancelButtonColor: '#6c757d',
                confirmButtonText: 'Ya, Reject!',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed) {
                    document.getElementById('reject-form').submit();
                }
            });
        }

        function confirmPersonaliaApprove() {
            document.getElementById('catatan_personalia_approve').value = document.getElementById('catatan_personalia')
                .value;

            Swal.fire({
                title: 'Approve DKL',
                text: 'Apakah Anda yakin ingin meng-APPROVE DKL {{ $dkl->no_dkl }} sebagai Personalia?',
                icon: 'question',
                showCancelButton: true,
                confirmButtonColor: '#2dce89',
                cancelButtonColor: '#6c757d',
                confirmButtonText: 'Ya, Approve!',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed) {
                    document.getElementById('approve-personalia-form').submit();
                }
            });
        }

        function confirmPersonaliaReject() {
            var catatan = document.getElementById('catatan_personalia').value;
            if (!catatan || catatan.trim() === '') {
                Swal.fire({
                    title: 'Catatan Wajib Diisi',
                    text: 'Anda harus mengisi catatan personalia saat me-reject DKL.',
                    icon: 'warning',
                    confirmButtonColor: '#028284',
                    confirmButtonText: 'OK'
                });
                document.getElementById('catatan_personalia').focus();
                return;
            }

            document.getElementById('catatan_personalia_reject').value = catatan;

            Swal.fire({
                title: 'Reject DKL',
                text: 'Apakah Anda yakin ingin me-REJECT DKL {{ $dkl->no_dkl }} sebagai Personalia?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#f5365c',
                cancelButtonColor: '#6c757d',
                confirmButtonText: 'Ya, Reject!',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed) {
                    document.getElementById('reject-personalia-form').submit();
                }
            });
        }
    </script>
@endsection