@extends('admin.layouts.app')

@section('title', 'Property Documents')
@section('breadcrumb')
<li class="flex items-center gap-1.5"><svg class="w-3.5 h-3.5 text-gray-300" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m8.25 4.5 7.5 7.5-7.5 7.5"/></svg></li>
<li><a href="{{ route('admin.properties.index') }}" class="hover:text-primary-600 transition-colors">Properties</a></li>
<li class="flex items-center gap-1.5"><svg class="w-3.5 h-3.5 text-gray-300" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="m8.25 4.5 7.5 7.5-7.5 7.5"/></svg></li>
<li><span class="text-gray-500">Documents</span></li>
@endsection
@section('heading', 'Property Documents')
@section('subheading', 'Manage property documents and legal papers.')

@section('content')

<div class="bg-white rounded-xl border border-gray-100 overflow-hidden">
    <div class="overflow-x-auto">
        <table class="w-full text-sm">
            <thead>
                <tr class="border-b border-gray-100 bg-gray-50/50">
                    <th class="text-left text-xs font-medium text-gray-500 uppercase tracking-wider px-5 py-3">Property</th>
                    <th class="text-left text-xs font-medium text-gray-500 uppercase tracking-wider px-5 py-3">Document Name</th>
                    <th class="text-left text-xs font-medium text-gray-500 uppercase tracking-wider px-5 py-3">Type</th>
                    <th class="text-left text-xs font-medium text-gray-500 uppercase tracking-wider px-5 py-3">File Size</th>
                    <th class="text-left text-xs font-medium text-gray-500 uppercase tracking-wider px-5 py-3">Uploaded By</th>
                    <th class="text-left text-xs font-medium text-gray-500 uppercase tracking-wider px-5 py-3">Date</th>
                    <th class="text-left text-xs font-medium text-gray-500 uppercase tracking-wider px-5 py-3">Actions</th>
                </tr>
            </thead>
            <tbody>
                @foreach ([
                    ['property' => '3 BHK Luxury Apartment', 'doc' => 'Brochure_3BHK_Bandra.pdf', 'type' => 'Brochure', 'size' => '2.4 MB', 'by' => 'Raj Mehta', 'date' => '14 Feb 2025'],
                    ['property' => 'Premium Villa with Pool', 'doc' => 'Title_Deed_Juhu.pdf', 'type' => 'Title Deed', 'size' => '1.8 MB', 'by' => 'Priya Sharma', 'date' => '13 Feb 2025'],
                    ['property' => 'Commercial Office Space', 'doc' => 'NOC_BKC.pdf', 'type' => 'NOC', 'size' => '856 KB', 'by' => 'Arjun Verma', 'date' => '12 Feb 2025'],
                    ['property' => '2 BHK Apartment', 'doc' => 'Legal_Agreement_Koramangala.pdf', 'type' => 'Legal', 'size' => '3.2 MB', 'by' => 'Neha Gupta', 'date' => '11 Feb 2025'],
                    ['property' => 'Residential Plot', 'doc' => 'Tax_Receipt_2024.pdf', 'type' => 'Tax Receipt', 'size' => '245 KB', 'by' => 'Vikram Singh', 'date' => '10 Feb 2025'],
                    ['property' => 'Penthouse Duplex', 'doc' => 'Brochure_Penthouse_Worli.pdf', 'type' => 'Brochure', 'size' => '4.1 MB', 'by' => 'Sunita Rao', 'date' => '9 Feb 2025'],
                ] as $doc)
                <tr class="hover:bg-gray-50/50 transition-colors group">
                    <td class="px-5 py-3.5 font-medium text-gray-800">{{ $doc['property'] }}</td>
                    <td class="px-5 py-3.5 text-gray-600">{{ $doc['doc'] }}</td>
                    <td class="px-5 py-3.5">
                        <span class="inline-block px-2 py-0.5 text-[11px] font-medium rounded-full
                            {{ $doc['type'] === 'Brochure' ? 'bg-primary-50 text-primary-600' : '' }}
                            {{ $doc['type'] === 'Title Deed' ? 'bg-emerald-50 text-emerald-600' : '' }}
                            {{ $doc['type'] === 'NOC' ? 'bg-blue-50 text-blue-600' : '' }}
                            {{ $doc['type'] === 'Legal' ? 'bg-amber-50 text-amber-600' : '' }}
                            {{ $doc['type'] === 'Tax Receipt' ? 'bg-gray-100 text-gray-600' : '' }}
                        ">{{ $doc['type'] }}</span>
                    </td>
                    <td class="px-5 py-3.5 text-gray-600">{{ $doc['size'] }}</td>
                    <td class="px-5 py-3.5 text-gray-600">{{ $doc['by'] }}</td>
                    <td class="px-5 py-3.5 text-gray-500">{{ $doc['date'] }}</td>
                    <td class="px-5 py-3.5">
                        <div class="flex items-center gap-2">
                            <a href="#" class="text-primary-500 hover:text-primary-600 text-sm font-medium">Download</a>
                            <a href="#" class="text-red-500 hover:text-red-600 text-sm font-medium">Delete</a>
                        </div>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>

@endsection