<x-app-layout>
    <div class="py-12 px-6 lg:px-12 min-h-screen">
        <div class="max-w-[1600px] mx-auto space-y-12">
            <!-- Phase 15: Corporate Asset Directory -->
            <header class="flex flex-col md:flex-row md:items-end justify-between gap-10 animate-in fade-in slide-in-from-top-4 duration-1000">
                <div class="space-y-4 border-l-4 border-white/20 pl-6">
                    <h2 class="font-display text-4xl font-black text-white tracking-tighter italic uppercase leading-none">Direktori Korporasi Leasing</h2>
                    <p class="text-slate-500 text-[10px] font-black uppercase tracking-[0.4em] italic leading-none">Database Entitas Rekanan — Sistem Manajemen Ekosistem v2.5</p>
                </div>
            </header>

            <div class="bg-white/5 rounded-[48px] border border-white/5 shadow-[0_40px_100px_-20px_rgba(0,0,0,0.6)] overflow-hidden">
                <div class="overflow-x-auto pb-4 custom-scrollbar">
                    <table class="w-full text-left min-w-[1000px]">
                        <thead class="bg-white/5 border-b border-white/5 text-slate-500 text-[9px] font-black uppercase tracking-[0.4em] italic">
                            <tr>
                                <th class="px-6 py-6">Entitas Perusahaan</th>
                                <th class="px-6 py-6">Kontak Administratif</th>
                                <th class="px-6 py-6">Koordinat Fisik</th>
                                <th class="px-6 py-6">Status Keamanan</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-white/5">
                            @forelse($leasings as $leasing)
                                <tr class="hover:bg-white/5 transition-all duration-300 group">
                                    <td class="px-6 py-8">
                                        <div class="font-display font-black text-white text-[15px] mb-1.5 uppercase italic tracking-tight group-hover:text-amber-400 transition-colors">{{ $leasing->company_name }}</div>
                                        <div class="text-[9px] font-black text-slate-600 uppercase tracking-[0.3em] leading-none italic">Partner Korporasi Terverifikasi</div>
                                    </td>
                                    <td class="px-6 py-8">
                                        <div class="font-display font-black text-white text-[13px] mb-1 uppercase tracking-tight">{{ $leasing->user->name }}</div>
                                        <div class="text-[9px] font-black text-slate-600 uppercase tracking-widest italic leading-none">{{ $leasing->user->email }}</div>
                                    </td>
                                    <td class="px-6 py-8">
                                        <div class="group-hover:translate-x-1 transition-transform duration-500">
                                            <div class="text-[11px] font-bold text-slate-400 italic leading-relaxed">{{ $leasing->address ?: 'Koordinat Fisik Belum Ditentukan' }}</div>
                                        </div>
                                    </td>
                                    <td class="px-6 py-8">
                                        <span class="inline-flex items-center px-5 py-2 {{ $leasing->user->account_status === 'active' ? 'bg-emerald-500/10 text-emerald-400 border-emerald-500/20' : 'bg-rose-500/10 text-rose-400 border-rose-500/20' }} rounded-xl text-[9px] font-black uppercase tracking-[0.2em] border italic shadow-2xl">
                                            {{ $leasing->user->account_status }}
                                        </span>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="4" class="px-12 py-40 text-center">
                                        <div class="w-24 h-24 bg-white/5 rounded-[40px] flex items-center justify-center mx-auto mb-10 border border-white/10 shadow-3xl">
                                            <svg class="w-12 h-12 text-slate-800" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"></path></svg>
                                        </div>
                                        <h4 class="text-3xl font-display font-black text-white uppercase italic tracking-tighter mb-4 leading-none">Ekosistem Kosong</h4>
                                        <p class="text-slate-700 text-[10px] font-black uppercase tracking-[0.3em] max-w-sm mx-auto leading-relaxed italic text-balance">Belum ada entitas korporasi yang terintegrasi dalam arsitektur ekosistem Anda.</p>
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
                
                @if($leasings->hasPages())
                    <div class="p-12 bg-white/[0.02] border-t border-white/5">
                        {{ $leasings->links() }}
                    </div>
                @endif
            </div>
        </div>
    </div>
</x-app-layout>
