@extends('layouts.app')

@section('content')
<div class="bg-white p-6 rounded-lg shadow-md">
    <div class="flex justify-between items-center mb-6">
        <h2 class="text-xl font-bold text-gray-800">Bank Statement Reconciliation</h2>
        <form method="GET" action="{{ route('reconciliation.index') }}" class="flex items-center space-x-2">
            <input type="date" name="date" value="{{ $filterDate }}" class="border p-2 rounded shadow-sm">
            <button type="submit" class="bg-blue-600 text-white px-3 py-2 rounded text-sm">Filter</button>
        </form>
    </div>

    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
        <!-- Approved Collections -->
        <div>
            <h3 class="font-semibold text-gray-700 mb-2">Pending Collections (ERP)</h3>
            <div class="space-y-2">
                @forelse($unmatchedCollections as $col)
                    <div class="p-3 border rounded flex justify-between items-center bg-gray-50">
                        <div>
                            <p class="font-bold text-sm">{{ $col->dealer->name ?? 'N/A' }}</p>
                            <p class="text-xs text-gray-500">Ref: {{ $col->bank_reference_no ?? 'N/A' }}</p>
                        </div>
                        <span class="text-green-600 font-bold">Tk. {{ number_format($col->amount, 2) }}</span>
                    </div>
                @empty
                    <p class="text-xs text-gray-400">No pending records found for this date.</p>
                @endforelse
            </div>
        </div>

        <!-- Bank Statements -->
        <div>
            <h3 class="font-semibold text-gray-700 mb-2">Bank PDF Transactions</h3>
            <div class="space-y-2">
                @forelse($unmatchedStatements as $stmt)
                    <div class="p-3 border rounded flex justify-between items-center bg-blue-50">
                        <div>
                            <p class="font-bold text-xs text-gray-600">Ref: {{ $stmt->reference_no }}</p>
                            <span class="text-blue-600 font-bold">Tk. {{ number_format($stmt->credit_amount, 2) }}</span>
                        </div>
                        @if($unmatchedCollections->count() > 0)
                            <form method="POST" action="{{ route('reconciliation.match') }}">
                                @csrf
                                <input type="hidden" name="collection_id" value="{{ $unmatchedCollections->first()->id }}">
                                <input type="hidden" name="statement_id" value="{{ $stmt->id }}">
                                <button type="submit" class="bg-indigo-600 text-white text-xs px-2.5 py-1.5 rounded hover:bg-indigo-700">
                                    Match
                                </button>
                            </form>
                        @endif
                    </div>
                @empty
                    <p class="text-xs text-gray-400">No unmatched bank entries.</p>
                @endforelse
            </div>
        </div>
    </div>
</div>
@endsection