@extends('layouts.app')

@section('title', 'Universal Document Types Master')

@section('content')
<div class="space-y-6">
    <div class="flex items-center justify-between">
        <div>
            <h1 class="text-xl font-bold text-slate-900 dark:text-white">Document Types Master</h1>
            <p class="text-xs text-slate-500">Universal document type catalog (Passport, Emirates ID, Visa, Trade License, Ejari, etc.).</p>
        </div>
    </div>

    <div class="bg-white dark:bg-slate-800 rounded-3xl border border-slate-200 dark:border-slate-700/60 shadow-sm overflow-hidden text-xs">
        <div class="overflow-x-auto">
            <table class="w-full text-left rtl:text-right">
                <thead class="bg-slate-50 dark:bg-slate-900/60 border-b border-slate-200 dark:border-slate-700 text-slate-500 uppercase tracking-wider font-bold">
                    <tr>
                        <th class="px-6 py-4">Document Type</th>
                        <th class="px-6 py-4">Code</th>
                        <th class="px-6 py-4">Entity Scope</th>
                        <th class="px-6 py-4">Number Required</th>
                        <th class="px-6 py-4">Expiry Reminder</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-200 dark:divide-slate-700/60 font-medium">
                    @forelse($documentTypes as $docType)
                        <tr class="hover:bg-slate-50 dark:hover:bg-slate-700/30">
                            <td class="px-6 py-4 font-bold text-slate-900 dark:text-white">{{ $docType->name_en }}</td>
                            <td class="px-6 py-4 font-mono text-slate-400">{{ $docType->code }}</td>
                            <td class="px-6 py-4 uppercase text-[10px] font-bold text-slate-500">{{ $docType->entity_type }}</td>
                            <td class="px-6 py-4 font-bold text-sky-600">Yes</td>
                            <td class="px-6 py-4 text-emerald-500 font-bold">Supported</td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="5" class="px-6 py-8 text-center text-slate-400 font-semibold">
                                System universal document types pre-configured for Passport, Emirates ID, Visas, and Trade Licenses.
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection