@extends('layouts.app')

@section('title', 'Verify Treasury Receipt - ERAS')

@section('content')
<main class="relative">
    {{-- Hero Section --}}
    <section class="py-16 lg:py-20">
        <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
            <div class="text-center max-w-3xl mx-auto">
                <h1 class="text-3xl lg:text-4xl font-semibold tracking-tight text-gray-900 mb-4">
                    Verify Treasury Receipt
                </h1>
                <div class="w-16 h-1 bg-emerald-600 mx-auto mb-6"></div>
                <p class="text-lg text-gray-600">
                    This section helps in verifying treasury receipts.
                </p>
            </div>
        </div>
    </section>

    {{-- Content Section --}}
    <section class="pb-16 lg:pb-24">
        <div class="mx-auto max-w-3xl px-4 sm:px-6 lg:px-8">
            <div class="bg-white/60 backdrop-blur-md rounded-xl border border-white/30 p-8">
                <h2 class="text-xl font-semibold text-gray-900 mb-6">Verify Treasury Receipt</h2>

                @if(session('error'))
                    <div class="mb-6 p-4 bg-red-50 border border-red-200 rounded-lg text-red-700">
                        {{ session('error') }}
                    </div>
                @endif

                @if(session('success'))
                    <div class="mb-6 p-4 bg-green-50 border border-green-200 rounded-lg text-green-700">
                        {{ session('success') }}
                    </div>
                @endif

                @if(isset($trValid) && $trValid === true)
                    <div class="mb-6 p-4 bg-green-50 border border-green-200 rounded-lg">
                        <p class="text-green-700 font-medium mb-2">The bill number and receipt number you submitted are valid.</p>
                        <ul class="list-disc list-inside text-green-600 space-y-1">
                            <li>This is a true Treasury Receipt</li>
                            @if(isset($trDocumentUrl))
                                <li>To View Treasury Receipt <a href="{{ $trDocumentUrl }}" target="_blank" class="text-emerald-600 hover:underline font-medium">Click Here</a></li>
                            @endif
                        </ul>
                    </div>
                @elseif(isset($trValid) && $trValid === false)
                    <div class="mb-6 p-4 bg-red-50 border border-red-200 rounded-lg">
                        <p class="text-red-700 font-medium mb-2">The bill number and receipt number entered are invalid. Possible causes for this failure are:</p>
                        <ul class="list-disc list-inside text-red-600 space-y-1">
                            <li>The receipt number is not a valid receipt number</li>
                            <li>The bill number is not a valid bill number</li>
                        </ul>
                    </div>
                @endif

                <form action="{{ route('cbs.verify-treasury-receipt.post') }}" method="POST">
                    @csrf

                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
                        <div>
                            <label for="BillNumber" class="block text-sm font-medium text-gray-700 mb-2">Bill Number</label>
                            <input type="text" id="BillNumber" name="BillNumber" value="{{ old('BillNumber') }}" placeholder="Enter Bill Number" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 transition" required>
                            @error('BillNumber')
                                <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                            @enderror
                        </div>

                        <div>
                            <label for="ReceiptNumber" class="block text-sm font-medium text-gray-700 mb-2">Receipt Number</label>
                            <input type="text" id="ReceiptNumber" name="ReceiptNumber" value="{{ old('ReceiptNumber') }}" placeholder="Enter Receipt Number" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 transition" required>
                            @error('ReceiptNumber')
                                <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                            @enderror
                        </div>
                    </div>

                    <div class="flex justify-end">
                        <button type="submit" class="inline-flex items-center gap-2 bg-emerald-600 text-white px-6 py-3 rounded-lg hover:bg-emerald-700 transition font-medium">
                            Submit
                            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/></svg>
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </section>
</main>
@endsection