@extends('admin.layouts.app')

@section('title', 'User Details')

@section('content')
<div class="space-y-6">
    <!-- Header with Back Button -->
    <div class="flex items-center justify-between">
        <div class="flex items-center gap-4">
            <a href="{{ route('admin.nurses.index') }}" class="p-2 hover:bg-slate-100 rounded-lg">
                <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
                </svg>
            </a>
            <div>
                <h1 class="text-2xl font-bold text-slate-900">{{ $nurse->name }}</h1>
                <p class="text-sm text-slate-600 mt-1">Joined {{ $nurse->created_at->format('M d, Y') }}</p>
            </div>
        </div>
        <div class="flex gap-3">
            <form method="POST" action="{{ route('admin.nurses.toggle-status', $nurse) }}">
                @csrf
                @method('PATCH')
                <button type="submit" class="px-4 py-2 {{ $nurse->is_active ? 'bg-amber-600 hover:bg-amber-700' : 'bg-green-600 hover:bg-green-700' }} text-white rounded-lg transition">
                    {{ $nurse->is_active ? 'Deactivate' : 'Activate' }}
                </button>
            </form>
            <button onclick="confirmDelete()" class="admin-btn admin-btn-danger">Delete</button>
        </div>
    </div>

    <!-- Status Badge -->
    <div class="flex items-center gap-3">
        @if($nurse->is_active)
            <span class="px-3 py-1 bg-green-100 text-green-800 rounded-full text-sm font-semibold">Active</span>
        @else
            <span class="px-3 py-1 bg-red-100 text-red-800 rounded-full text-sm font-semibold">Inactive</span>
        @endif
    </div>

    <!-- Stats Cards -->
    <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
        <div class="bg-white rounded-xl border border-slate-200 p-6">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-sm text-slate-600">Total Applications</p>
                    <p class="text-2xl font-bold text-slate-900 mt-1">{{ $stats['total'] }}</p>
                </div>
                <div class="w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center">
                    <svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
                    </svg>
                </div>
            </div>
        </div>

        <div class="bg-white rounded-xl border border-slate-200 p-6">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-sm text-slate-600">Pending</p>
                    <p class="text-2xl font-bold text-amber-600 mt-1">{{ $stats['pending'] }}</p>
                </div>
                <div class="w-12 h-12 bg-amber-100 rounded-lg flex items-center justify-center">
                    <svg class="w-6 h-6 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
                    </svg>
                </div>
            </div>
        </div>

        <div class="bg-white rounded-xl border border-slate-200 p-6">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-sm text-slate-600">Accepted</p>
                    <p class="text-2xl font-bold text-green-600 mt-1">{{ $stats['accepted'] }}</p>
                </div>
                <div class="w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center">
                    <svg class="w-6 h-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
                    </svg>
                </div>
            </div>
        </div>

        <div class="bg-white rounded-xl border border-slate-200 p-6">
            <div class="flex items-center justify-between">
                <div>
                    <p class="text-sm text-slate-600">Rejected</p>
                    <p class="text-2xl font-bold text-red-600 mt-1">{{ $stats['rejected'] }}</p>
                </div>
                <div class="w-12 h-12 bg-red-100 rounded-lg flex items-center justify-center">
                    <svg class="w-6 h-6 text-red-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
                    </svg>
                </div>
            </div>
        </div>
    </div>

    <!-- Profile Information -->
    <div class="bg-white rounded-xl border border-slate-200">
        <div class="px-6 py-4 border-b">
            <h2 class="text-lg font-bold text-slate-900">Profile Information</h2>
        </div>
        <div class="p-6">
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <div>
                    <label class="text-sm font-semibold text-slate-700">Full Name</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->full_name ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">Email</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->email }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">Phone</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->phone ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">Primary Specialty</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->primary_specialty ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">Secondary Specialty</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->secondary_specialty ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">Experience</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->experience_years ?? 0 }} years</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">NCLEX Status</label>
                    <p class="text-slate-900 mt-1">
                        <span class="px-2 py-1 rounded-full text-xs font-semibold 
                            {{ $nurse->nurseProfile->nclex_status === 'passed' ? 'bg-green-100 text-green-800' : 'bg-amber-100 text-amber-800' }}">
                            {{ ucfirst($nurse->nurseProfile->nclex_status ?? 'N/A') }}
                        </span>
                    </p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">License Type</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->license_type ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">License Expiry</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->license_expiry ? \Carbon\Carbon::parse($nurse->nurseProfile->license_expiry)->format('M d, Y') : 'N/A' }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">Location</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->city ?? 'N/A' }}, {{ $nurse->nurseProfile->country ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">Willing to Relocate</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->willing_to_relocate ? 'Yes' : 'No' }}</p>
                </div>
                <div>
                    <label class="text-sm font-semibold text-slate-700">Visa Needed</label>
                    <p class="text-slate-900 mt-1">{{ $nurse->nurseProfile->visa_needed ? 'Yes' : 'No' }}</p>
                </div>
            </div>
        </div>
    </div>

    @php
        $headers = [
            ['label' => 'Job Title', 'class' => ''],
            ['label' => 'Employer', 'class' => ''],
            ['label' => 'Applied On', 'class' => 'w-36'],
            ['label' => 'Status', 'class' => 'w-40'],
        ];

        $rows = [];
        foreach($applications as $application) {
            $cells = [];

            $cells[] = ['content' => '<div class="text-sm font-semibold text-slate-900">' . e($application->jobPost->title ?? 'N/A') . '</div>', 'class' => ''];
            $cells[] = ['content' => '<div class="text-sm text-slate-700">' . e($application->jobPost->employer->name ?? 'N/A') . '</div>', 'class' => ''];
            $cells[] = ['content' => '<div class="text-sm text-slate-900">' . e($application->created_at->format('M d, Y')) . '</div>', 'class' => ''];

            $statusClass = $application->status === 'accepted' ? 'bg-green-100 text-green-800' : ($application->status === 'rejected' ? 'bg-red-100 text-red-800' : 'bg-amber-100 text-amber-800');
            $cells[] = ['content' => '<span class="px-2 py-1 rounded-full text-xs font-semibold ' . $statusClass . '">' . e(ucfirst($application->status)) . '</span>', 'class' => ''];

            $rows[] = ['cells' => $cells];
        }
    @endphp

    @if(empty($rows))
        <div class="bg-white rounded-xl border border-slate-200 p-6 text-center text-slate-500">No applications yet</div>
    @else
        @include('admin.components.table_shell', [
            'title' => 'Recent Applications',
            'headers' => $headers,
            'rows' => $rows,
        ])
    @endif

    <!-- Documents -->
    @if($documents->count() > 0)
    <div class="bg-white rounded-xl border border-slate-200">
        <div class="px-6 py-4 border-b">
            <h2 class="text-lg font-bold text-slate-900">Documents</h2>
        </div>
        <div class="p-6">
            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                @foreach($documents as $document)
                    <div class="flex items-center gap-3 p-4 border border-slate-200 rounded-lg">
                        <div class="w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center">
                            <svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
                            </svg>
                        </div>
                        <div class="flex-1">
                            <p class="text-sm font-semibold text-slate-900">{{ $document->document_type }}</p>
                            <p class="text-xs text-slate-500">Uploaded {{ $document->created_at->diffForHumans() }}</p>
                        </div>
                        <span class="px-2 py-1 text-xs font-semibold rounded-full
                            {{ $document->status === 'verified' ? 'bg-green-100 text-green-800' : 'bg-amber-100 text-amber-800' }}">
                            {{ ucfirst($document->status) }}
                        </span>
                    </div>
                @endforeach
            </div>
        </div>
    </div>
    @endif
</div>

<!-- Delete Confirmation Modal -->
<div id="deleteModal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
    <div class="bg-white rounded-xl p-6 max-w-md w-full mx-4">
        <h3 class="text-lg font-bold text-slate-900 mb-2">Delete User Account</h3>
        <p class="text-sm text-slate-600 mb-6">Are you sure you want to delete this user account? This will permanently remove all associated data including profile, applications, and documents. This action cannot be undone.</p>
        <div class="flex gap-3 justify-end">
            <button onclick="closeDeleteModal()" class="px-4 py-2 border border-slate-300 rounded-lg hover:bg-slate-50">Cancel</button>
            <form method="POST" action="{{ route('admin.nurses.destroy', $nurse) }}">
                @csrf
                @method('DELETE')
                <button type="submit" class="admin-btn admin-btn-danger">Delete</button>
            </form>
        </div>
    </div>
</div>

<script>
function confirmDelete() {
    AdminUtils.showModal('deleteModal');
}
function closeDeleteModal() {
    AdminUtils.hideModal('deleteModal');
}
</script>
@endsection