<div> {{-- PEMBUNGKUS UTAMA WAJIB --}}
    <div style="overflow-x:auto; -webkit-overflow-scrolling:touch;">
        <table class="dark-table" id="mainTable">
            <thead>
                <tr>
                    <th style="width:50px;">#</th>
                    <th>Nama Pendaki</th>
                    <th>No. WhatsApp</th>
                    <th>Asal</th>
                    <th>Waktu Naik</th>
                    <th>Status / Turun</th>
                    <th>Guide / PJ</th>
                    <th style="text-align:center;">Aksi</th>
                </tr>
            </thead>
            <tbody>
                @forelse($climbings as $climbing)
                    @php
                        // Menghitung durasi mendaki
                        $jamMendaki = \Carbon\Carbon::parse($climbing->created_at)->diffInHours(now());
                        // Status Terlambat jika lebih dari 25 jam dan belum checkout
                        $isOverdue = !$climbing->check_out_date && $jamMendaki > 25;
                        $isFinished = !empty($climbing->check_out_date);
                        
                        // LOGIKA PENENTU TOMBOL:
                        // Kita cek route saat ini, jika mengandung kata 'ticket-counter', paksa muncul tombol SELESAI
                        $isLoketRoute = str_contains(request()->url(), 'ticket-counter');
                    @endphp
                    
                    {{-- WIRE:KEY SANGAT PENTING AGAR DOM REALTIME TIDAK BENTROK --}}
                    <tr wire:key="climbing-row-{{ $climbing->id }}" 
                        onclick="Livewire.dispatch('load-climbing', { id: {{ $climbing->id }} })"
                        style="cursor: pointer;">
                        
                        <td>{{ str_pad($loop->iteration, 2, '0', STR_PAD_LEFT) }}</td>
                        
                        <td>
                            <div class="d-flex align-items-center gap-2">
                                @if($isOverdue)
                                    <div class="status-box status-overdue">⚠️</div>
                                @elseif($isFinished)
                                    <div class="status-box status-dn">DN</div>
                                @else
                                    <div class="status-box status-cl">CL</div>
                                @endif
                                <span class="fw-bold">{{ $climbing->name }}</span>
                            </div>
                        </td>

                        {{-- KOLOM NO HP DENGAN LINK WHATSAPP --}}
                        <td onclick="event.stopPropagation()">
                            @if($climbing->phone_number)
                                <a href="https://wa.me/{{ preg_replace('/[^0-9]/', '', $climbing->phone_number) }}" 
                                   target="_blank" 
                                   class="text-decoration-none" 
                                   style="color:var(--accent-teal); font-size:12px; font-weight:600;">
                                    <i class="bi bi-whatsapp me-1" style="color: #25D366;"></i>
                                    {{ $climbing->phone_number }}
                                </a>
                            @else
                                <span class="text-muted small">—</span>
                            @endif
                        </td>

                        <td><div style="font-size:12px;">{{ $climbing->residence }}</div></td>

                        <td>
                            <div class="time-main">{{ \Carbon\Carbon::parse($climbing->created_at)->timezone('Asia/Makassar')->format('d M Y') }}</div>
                            <span class="time-sub">{{ \Carbon\Carbon::parse($climbing->created_at)->timezone('Asia/Makassar')->format('H:i') }} WITA</span>
                        </td>

                        <td>
                            @if($isFinished)
                                <div class="time-main text-success">{{ \Carbon\Carbon::parse($climbing->check_out_date)->timezone('Asia/Makassar')->format('d M Y') }}</div>
                                <span class="time-sub">{{ \Carbon\Carbon::parse($climbing->check_out_date)->timezone('Asia/Makassar')->format('H:i') }} WITA</span>
                            @elseif($isOverdue)
                                <span class="status-overdue-blink">⚠️ TERLAMBAT!</span>
                            @else
                                <span style="color:var(--accent-amber); font-weight:700;"><i class="bi bi-geo-alt-fill"></i> Di Gunung</span>
                            @endif
                        </td>

                        <td>
                            @if($climbing->group_id && $climbing->group && $climbing->group->guide)
                                {{-- CEK DULU JIKA LEWAT GRUP --}}
                                <span class="text-info fw-bold" style="cursor:pointer;" 
                                      onclick="event.stopPropagation(); Livewire.dispatch('load-guide', { id: {{ $climbing->group->guide->id }} })">
                                    🪖 {{ $climbing->group->guide->name }}
                                </span>
                            @elseif($climbing->guide_id && $climbing->guide)
                                {{-- CEK JIKA PAKAI GUIDE INDIVIDU --}}
                                <span class="text-info fw-bold" style="cursor:pointer;" 
                                      onclick="event.stopPropagation(); Livewire.dispatch('load-guide', { id: {{ $climbing->guide->id }} })">
                                    🪖 {{ $climbing->guide->name }}
                                </span>
                            @else
                                <span class="text-muted small italic">Mandiri</span>
                            @endif
                        </td>

                        <td style="text-align:center;" onclick="event.stopPropagation()">
                            @if($isLoketRoute)
                                {{-- AREA LOKET: TOMBOL SELESAIKAN --}}
                                @if(!$isFinished)
                                    <form action="{{ route('climbing.finish', $climbing->id) }}" method="POST" onsubmit="return confirm('Konfirmasi pendaki ini sudah turun?')">
                                        @csrf @method('PATCH')
                                        <button type="submit" class="btn-finish-modern">
                                            <i class="bi bi-check2-circle me-1"></i> Selesaikan
                                        </button>
                                    </form>
                                @else
                                    <div class="status-done-chip">
                                        <i class="bi bi-check-all"></i> Selesai
                                    </div>
                                @endif
                            @else
                                {{-- AREA ADMIN: TOMBOL HAPUS --}}
                                <form action="{{ route('admin.climbing.destroy', $climbing->id) }}" method="POST" onsubmit="return confirm('Hapus data pendaki ini?')">
                                    @csrf @method('DELETE')
                                    <button type="submit" class="btn btn-sm" style="background: rgba(248,81,73,0.1); color: var(--accent-red); border: 1px solid rgba(248,81,73,0.2); border-radius: 8px; padding: 4px 10px; font-weight: 700; font-size: 11px;">
                                        <i class="bi bi-trash3-fill"></i> HAPUS
                                    </button>
                                </form>
                            @endif
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="8" class="text-center py-5 text-muted">Belum ada aktivitas pendakian hari ini.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>