@extends('layouts.app')

@section('title', 'Application Details - Admin')

@section('content')
<div class="min-h-screen bg-gray-50 p-6">
    <div class="max-w-5xl mx-auto">
        <!-- Back Button -->
        <div class="mb-6">
            <a href="{{ route('admin.dashboard') }}" 
               class="inline-flex items-center text-indigo-600 hover:text-indigo-800 font-medium">
                <svg class="w-5 h-5 mr-2" 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>
                Back to Dashboard
            </a>
        </div>

        @if (session('success'))
            <div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-6">
                {{ session('success') }}
            </div>
        @endif

        @if (session('error'))
            <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-6">
                {{ session('error') }}
            </div>
        @endif

        <!-- Application Header -->
        <div class="bg-white rounded-lg shadow-md overflow-hidden mb-6">
            <div class="bg-gradient-to-r from-indigo-600 to-indigo-800 px-6 py-6 text-white">
                <div class="flex justify-between items-start">
                    <div>
                        <h1 class="text-3xl font-bold mb-2">{{ $application->business_name }}</h1>
                        <p class="text-indigo-100">Application ID: #{{ $application->id }}</p>
                    </div>
                    <span class="px-4 py-2 text-sm font-semibold rounded-full
                        @if($application->status === 'pending') bg-yellow-400 text-yellow-900
                        @elseif($application->status === 'approved') bg-green-400 text-green-900
                        @elseif($application->status === 'rejected') bg-red-400 text-red-900
                        @else bg-gray-400 text-gray-900
                        @endif">
                        {{ ucfirst($application->status) }}
                    </span>
                </div>
            </div>

            <!-- Application Details -->
            <div class="px-6 py-6">
                <h3 class="text-lg font-bold text-gray-900 mb-4">Application Information</h3>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
                    <div>
                        <h4 class="text-sm font-semibold text-gray-500 uppercase mb-1">License Type</h4>
                        <p class="text-lg text-gray-900">{{ $application->license_type }}</p>
                    </div>
                    <div>
                        <h4 class="text-sm font-semibold text-gray-500 uppercase mb-1">Submitted Date</h4>
                        <p class="text-lg text-gray-900">{{ $application->created_at->format('F d, Y \a\t h:i A') }}</p>
                    </div>
                    <div>
                        <h4 class="text-sm font-semibold text-gray-500 uppercase mb-1">Applicant Name</h4>
                        <p class="text-lg text-gray-900">{{ $application->user->name }}</p>
                    </div>
                    <div>
                        <h4 class="text-sm font-semibold text-gray-500 uppercase mb-1">Email</h4>
                        <p class="text-lg text-gray-900">{{ $application->user->email }}</p>
                    </div>
                </div>

                <div class="border-t pt-6">
                    <h4 class="text-sm font-semibold text-gray-500 uppercase mb-2">Business Description</h4>
                    <p class="text-gray-700 leading-relaxed whitespace-pre-line">{{ $application->description }}</p>
                </div>
            </div>
        </div>

        <!-- Admin Actions -->
        @if($application->status === 'pending')
            <div class="bg-white rounded-lg shadow-md p-6 mb-6">
                <h3 class="text-lg font-bold text-gray-900 mb-4">Review Application</h3>
                <div class="flex gap-4">
                    <form method="POST" action="{{ route('admin.applications.approve', $application->id) }}" 
                          onsubmit="return confirm('Are you sure you want to approve this application? A license will be issued.');"
                          class="flex-1">
                        @csrf
                        @method('PATCH')
                        <button type="submit" 
                                class="w-full px-6 py-3 bg-green-600 text-white font-semibold rounded-lg hover:bg-green-700 transition">
                            ✓ Approve Application
                        </button>
                    </form>
                    
                    <form method="POST" action="{{ route('admin.applications.reject', $application->id) }}" 
                          onsubmit="return confirm('Are you sure you want to reject this application?');"
                          class="flex-1">
                        @csrf
                        @method('PATCH')
                        <button type="submit" 
                                class="w-full px-6 py-3 bg-red-600 text-white font-semibold rounded-lg hover:bg-red-700 transition">
                            ✗ Reject Application
                        </button>
                    </form>
                </div>
            </div>
        @endif

        <!-- License Information (if approved) -->
        @if($application->status === 'approved' && $application->license)
            <div class="bg-white rounded-lg shadow-md p-6 mb-6">
                <h3 class="text-lg font-bold text-gray-900 mb-4">License Information</h3>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                    <div>
                        <h4 class="text-sm font-semibold text-gray-500 uppercase mb-1">License Number</h4>
                        <p class="text-lg font-mono text-gray-900">{{ $application->license->license_number }}</p>
                    </div>
                    <div>
                        <h4 class="text-sm font-semibold text-gray-500 uppercase mb-1">Issue Date</h4>
                        <p class="text-lg text-gray-900">{{ $application->license->issue_date->format('F d, Y') }}</p>
                    </div>
                    <div>
                        <h4 class="text-sm font-semibold text-gray-500 uppercase mb-1">Expiry Date</h4>
                        <p class="text-lg text-gray-900">{{ $application->license->expiry_date->format('F d, Y') }}</p>
                    </div>
                    <div>
                        <h4 class="text-sm font-semibold text-gray-500 uppercase mb-1">Status</h4>
                        @if($application->license->is_revoked)
                            <p class="text-lg font-semibold text-red-600">REVOKED</p>
                        @else
                            <p class="text-lg font-semibold text-green-600">ACTIVE</p>
                        @endif
                    </div>
                </div>

                @if($application->license->is_revoked)
                    <div class="mt-6 p-4 bg-red-50 border border-red-200 rounded-lg">
                        <p class="text-sm font-semibold text-red-800 mb-2">Revocation Details:</p>
                        <p class="text-red-700">{{ $application->license->revoked_reason }}</p>
                        <p class="text-xs text-red-600 mt-2">
                            Revoked on: {{ $application->license->revoked_at->format('F d, Y \a\t h:i A') }}
                        </p>
                    </div>
                @endif
            </div>
        @endif

        <!-- Timeline -->
        <div class="bg-white rounded-lg shadow-md p-6">
            <h3 class="text-lg font-bold text-gray-900 mb-4">Timeline</h3>
            <div class="space-y-4">
                <div class="flex items-start">
                    <div class="flex-shrink-0 w-10 h-10 rounded-full bg-indigo-100 flex items-center justify-center">
                        <svg class="w-5 h-5 text-indigo-600" fill="currentColor" viewBox="0 0 20 20">
                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/>
                        </svg>
                    </div>
                    <div class="ml-4">
                        <p class="font-semibold text-gray-900">Application Submitted</p>
                        <p class="text-sm text-gray-500">{{ $application->created_at->format('F d, Y \a\t h:i A') }}</p>
                        <p class="text-sm text-gray-600 mt-1">Submitted by {{ $application->user->name }}</p>
                    </div>
                </div>

                @if($application->status !== 'pending')
                    <div class="flex items-start">
                        <div class="flex-shrink-0 w-10 h-10 rounded-full 
                            @if($application->status === 'approved') bg-green-100
                            @else bg-red-100
                            @endif flex items-center justify-center">
                            <svg class="w-5 h-5 
                                @if($application->status === 'approved') text-green-600
                                @else text-red-600
                                @endif" fill="currentColor" viewBox="0 0 20 20">
                                @if($application->status === 'approved')
                                    <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/>
                                @else
                                    <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/>
                                @endif
                            </svg>
                        </div>
                        <div class="ml-4">
                            <p class="font-semibold 
                                @if($application->status === 'approved') text-green-900
                                @else text-red-900
                                @endif">
                                Application {{ ucfirst($application->status) }}
                            </p>
                            <p class="text-sm text-gray-500">{{ $application->updated_at->format('F d, Y \a\t h:i A') }}</p>
                        </div>
                    </div>
                @endif
            </div>
        </div>
    </div>
</div>
@endsection