@extends('layouts.auth.app')

@section('title', 'Validate Tax Payer Income')

@section('content')
<!-- Hidden fields for JavaScript functions (matches .NET) -->
<input type="hidden" id="hdnTaxPayerTypeID" value="{{ $formData->TaxPayerTypeID ?? 1 }}">
<input type="hidden" id="hdnTaxPayerID" value="{{ $formData->TaxPayerID ?? $requestData->IndividualID ?? 0 }}">
<input type="hidden" id="hdnRequestID" value="{{ $requestData->TCCRequestID ?? 0 }}">

<div class="space-y-6">
    <!-- Header with Back Button -->
    <div class="flex items-center justify-between">
        <div class="flex items-center space-x-4">
            <a href="{{ route('process-tcc-request.details', $requestData->TCCRequestID) }}" class="inline-flex items-center text-gray-600 hover:text-gray-900 transition-colors">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
                </svg>
                Back to Details
            </a>
        </div>
        <h1 class="text-xl font-semibold text-gray-900">TCC Request - Validate Tax Payer Income</h1>
    </div>

    <!-- Request Information Card -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 bg-gray-50">
            <h3 class="text-lg font-semibold text-gray-900">Request Information</h3>
        </div>
        <div class="px-6 py-4">
            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Request Ref No</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $requestData->RequestRefNo ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Request Date</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $requestData->RequestDate ? \Carbon\Carbon::parse($requestData->RequestDate)->format('d-M-Y') : 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Year</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $requestData->TaxYear ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Payer Name</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $requestData->TaxPayerName ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Payer RIN</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $requestData->TaxPayerRIN ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Mobile Number</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $requestData->MobileNumber ?? 'N/A' }}</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Associated Assets Card -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 bg-gray-50">
            <h3 class="text-lg font-semibold text-gray-900">Associated Assets</h3>
        </div>
        <div class="px-6 py-4">
            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-gray-200" id="tblAssetList">
                    <thead class="bg-gray-50">
                        <tr>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Asset Type</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Asset Name</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tax Payer Role</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Action</th>
                        </tr>
                    </thead>
                    <tbody class="bg-white divide-y divide-gray-200">
                        @forelse($assetList ?? [] as $asset)
                        <tr>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $asset->AssetTypeName ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $asset->AssetName ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $asset->TaxPayerRoleName ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm">
                                <button onclick="showAssetDetails({{ $asset->TPAID ?? 0 }})" class="text-teal-600 hover:text-teal-900">Quick View</button>
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="4" class="px-4 py-6 text-center text-sm text-gray-500">No assets found</td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Direct Assessment Income Streams (matches .NET _BindIncomeStreamTable.cshtml) -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 bg-gray-50">
            <div class="flex items-center justify-between">
                <h3 class="text-lg font-semibold text-gray-900">Direct Assessment Income Streams</h3>
                <button onclick="openIncomeStreamModal()" class="inline-flex items-center px-3 py-1.5 bg-red-600 border border-transparent rounded-md text-xs font-medium text-white hover:bg-red-700 transition-colors">
                    <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
                    </svg>
                    New Direct Assessment Income Streams
                </button>
            </div>
        </div>
        <div class="px-6 py-4" id="dvIncomeStreamData">
            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-gray-200" id="tblIncomeStream">
                    <thead class="bg-gray-50">
                        <tr>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tax Year</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Role</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Business Name</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">LGA</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Income Amount</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Action</th>
                        </tr>
                    </thead>
                    <tbody class="bg-white divide-y divide-gray-200">
                        @php $totalIncomeAmount = 0; @endphp
                        @forelse($incomeStreamList ?? [] as $income)
                        @php $totalIncomeAmount += $income->TotalIncomeEarned ?? 0; @endphp
                        <tr>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $income->TaxYear ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $income->TaxPayerRoleName ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $income->BusinessName ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $income->LGAName ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($income->TotalIncomeEarned ?? 0, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm">
                                <div class="relative inline-block text-left" x-data="{ open: false }">
                                    <button @click="open = !open" type="button" class="inline-flex items-center px-2.5 py-1.5 border border-gray-300 shadow-sm text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-teal-500">
                                        Action
                                        <svg class="ml-1 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/></svg>
                                    </button>
                                    <div x-show="open" @click.away="open = false" class="origin-top-right absolute right-0 mt-2 w-32 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 z-10">
                                        <div class="py-1">
                                            <a href="javascript:void(0)" onclick="jsfn_EditIncomeStream({{ $income->RowID ?? 0 }})" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Edit</a>
                                            <a href="javascript:void(0)" onclick="jsfn_DeleteIncomeStream({{ $income->RowID ?? 0 }})" class="block px-4 py-2 text-sm text-red-600 hover:bg-gray-100">Remove</a>
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="6" class="px-4 py-6 text-center text-sm text-gray-500">No income streams found</td>
                        </tr>
                        @endforelse
                    </tbody>
                    @if(count($incomeStreamList ?? []) > 0)
                    <tfoot class="bg-gray-50">
                        <tr>
                            <td class="px-4 py-3 text-sm font-semibold text-gray-900">Total</td>
                            <td class="px-4 py-3"></td>
                            <td class="px-4 py-3"></td>
                            <td class="px-4 py-3"></td>
                            <td class="px-4 py-3 text-sm font-semibold text-gray-900">{{ number_format($totalIncomeAmount, 2) }}</td>
                            <td class="px-4 py-3"></td>
                        </tr>
                    </tfoot>
                    @endif
                </table>
            </div>
        </div>
    </div>

    <!-- PAYE Income Streams (matches .NET _BindPayeIncomeStreamTable.cshtml) -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 bg-gray-50">
            <h3 class="text-lg font-semibold text-gray-900">PAYE Income Streams</h3>
        </div>
        <div class="px-6 py-4" id="dvPayeIncomeStreamData">
            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-gray-200" id="tblPayeIncomeStream">
                    <thead class="bg-gray-50">
                        <tr>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tax Year</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Business Name</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Income Amount</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Assessed Amount</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tax Paid</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Balance</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Receipt Detail</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Action</th>
                        </tr>
                    </thead>
                    <tbody class="bg-white divide-y divide-gray-200">
                        @php $totalPayeGross = 0; @endphp
                        @forelse($payeIncomeStreamList ?? [] as $paye)
                        @php
                            $annualTax = $paye->AnnualTax ?? $paye->PayeAssessedAmount ?? 0;
                            $annualTaxII = $paye->AnnualTaxII ?? $paye->PayeTaxPaid ?? 0;
                            $balance = $annualTax - $annualTaxII;
                            $totalPayeGross += $paye->AnnualGross ?? $paye->ChargeableIncome ?? $paye->AssessableIncome ?? 0;
                        @endphp
                        <tr>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $paye->TaxYear ?? $paye->AssessmentYear ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $paye->EmployerName ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($paye->ChargeableIncome ?? $paye->AssessableIncome ?? 0, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($annualTax, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($annualTaxII, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($balance, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $paye->ReceiptDetail ?? $paye->ReceiptRef ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm">
                                <div class="relative inline-block text-left" x-data="{ open: false }">
                                    <button @click="open = !open" type="button" class="inline-flex items-center px-2.5 py-1.5 border border-gray-300 shadow-sm text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-teal-500">
                                        Action
                                        <svg class="ml-1 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/></svg>
                                    </button>
                                    <div x-show="open" @click.away="open = false" class="origin-top-right absolute right-0 mt-2 w-32 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 z-10">
                                        <div class="py-1">
                                            <a href="javascript:void(0)" onclick="jsfn_EditPAYEIncomeStream({{ $paye->RowID ?? 0 }})" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Edit</a>
                                            <a href="javascript:void(0)" onclick="jsfn_DeletePayeIncomeStream({{ $paye->RowID ?? 0 }})" class="block px-4 py-2 text-sm text-red-600 hover:bg-gray-100">Remove</a>
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="8" class="px-4 py-6 text-center text-sm text-gray-500">No PAYE income streams found</td>
                        </tr>
                        @endforelse
                    </tbody>
                    @if(count($payeIncomeStreamList ?? []) > 0)
                    <tfoot class="bg-gray-50">
                        <tr>
                            <td class="px-4 py-3 text-sm font-semibold text-gray-900">Total</td>
                            <td class="px-4 py-3"></td>
                            <td class="px-4 py-3 text-sm font-semibold text-gray-900">{{ number_format($totalPayeGross, 2) }}</td>
                            <td class="px-4 py-3"></td>
                            <td class="px-4 py-3"></td>
                            <td class="px-4 py-3"></td>
                            <td class="px-4 py-3"></td>
                            <td class="px-4 py-3"></td>
                        </tr>
                    </tfoot>
                    @endif
                </table>
            </div>
        </div>
    </div>

    <!-- TCC Details (matches .NET _BindTCCDetailTable.cshtml - READ-ONLY, NO Action column) -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 bg-gray-50">
            <h3 class="text-lg font-semibold text-gray-900">TCC Details</h3>
        </div>
        <div class="px-6 py-4" id="dvTCCDetailData">
            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-gray-200" id="tblTCCDetail">
                    <thead class="bg-gray-50">
                        <tr>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tax Year</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Total Income</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Total Assessed</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Total Tax Paid</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Balance</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Treasury Receipt No.</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Revenue Type</th>
                        </tr>
                    </thead>
                    <tbody class="bg-white divide-y divide-gray-200">
                        @forelse($tccDetailList ?? [] as $detail)
                        @php
                            $erasAssessed = $detail->ERASAssessed ?? 0;
                            $erasTaxPaid = $detail->ERASTaxPaid ?? 0;
                            $balance = $erasAssessed - $erasTaxPaid;
                        @endphp
                        <tr>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $detail->TaxYear ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($detail->AssessableIncome ?? 0, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($erasAssessed, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($erasTaxPaid, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($balance, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $detail->Tax_receipt ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $detail->RevenueType ?? '' }}</td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="7" class="px-4 py-6 text-center text-sm text-gray-500">No TCC details found</td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Tax Certificate Data -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 bg-gray-50">
            <h3 class="text-lg font-semibold text-gray-900">Tax Certificate Data</h3>
        </div>
        <div class="px-6 py-4">
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Payer Type</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $formData->TaxPayerTypeName ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Payer Name</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $formData->TaxPayerName ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Year</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $formData->TaxYear ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Request Ref No</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $formData->RequestRefNo ?? 'N/A' }}</p>
                </div>
                <div>
                    <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Serial Number</label>
                    <p class="text-sm font-semibold text-gray-900">{{ $formData->SerialNumber ?? 'N/A' }}</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Liability Summary -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 bg-gray-50">
            <h3 class="text-lg font-semibold text-gray-900">Liability Summary</h3>
        </div>
        <div class="px-6 py-4">
            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-gray-200" id="tblLiabilitySummary">
                    <thead class="bg-gray-50">
                        <tr>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tax Year</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Total Assessed</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Total Paid</th>
                            <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Balance</th>
                        </tr>
                    </thead>
                    <tbody class="bg-white divide-y divide-gray-200">
                        @php
                            $totalAssessed = 0;
                            $totalPaid = 0;
                            $totalBalance = 0;
                        @endphp
                        @forelse($taxPayerLiability ?? [] as $liability)
                        @php
                            $totalAssessed += $liability->AssessmentAmount ?? 0;
                            $totalPaid += $liability->PaymentAmount ?? 0;
                            $totalBalance += $liability->BalanceAmount ?? 0;
                        @endphp
                        <tr>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ $liability->TaxYear ?? '' }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($liability->AssessmentAmount ?? 0, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($liability->PaymentAmount ?? 0, 2) }}</td>
                            <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-900">{{ number_format($liability->BalanceAmount ?? 0, 2) }}</td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="4" class="px-4 py-6 text-center text-sm text-gray-500">No liability records found</td>
                        </tr>
                        @endforelse
                    </tbody>
                    @if(count($taxPayerLiability ?? []) > 0)
                    <tfoot class="bg-gray-50">
                        <tr>
                            <td class="px-4 py-3 text-sm font-semibold text-gray-900">Totals</td>
                            <td class="px-4 py-3 text-sm font-semibold text-gray-900">{{ number_format($totalAssessed, 2) }}</td>
                            <td class="px-4 py-3 text-sm font-semibold text-gray-900">{{ number_format($totalPaid, 2) }}</td>
                            <td class="px-4 py-3 text-sm font-semibold text-gray-900">{{ number_format($totalBalance, 2) }}</td>
                        </tr>
                    </tfoot>
                    @endif
                </table>
            </div>
        </div>
    </div>

    <!-- Validation Form -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200 bg-gray-50">
            <h3 class="text-lg font-semibold text-gray-900">Validate Tax Payer Income</h3>
        </div>

        <form id="frmValidateTaxPayerIncome" action="{{ route('process-tcc-request.validate-taxpayer-income.post', $requestData->TCCRequestID) }}" method="POST">
            @csrf
            <input type="hidden" name="RequestID" value="{{ $requestData->TCCRequestID }}">
            <input type="hidden" name="VTPIncomeID" value="{{ $formData->VTPIncomeID ?? '' }}">
            <input type="hidden" name="TCCID" value="{{ $formData->TCCID ?? '' }}">
            <input type="hidden" name="TaxPayerID" value="{{ $formData->TaxPayerID ?? '' }}">
            <input type="hidden" name="TaxPayerTypeID" value="{{ $formData->TaxPayerTypeID ?? '' }}">

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

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

                @if($errors->any())
                <div class="mb-4 p-4 bg-red-50 border border-red-200 text-red-700 rounded-lg">
                    <ul class="list-disc list-inside">
                        @foreach($errors->all() as $error)
                        <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
                @endif

                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                    <!-- Source of Income - populated from NatureOfBusiness table (matches .NET) -->
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Source of Income <span class="text-red-500">*</span></label>
                        <select name="SourceOfIncome" id="SourceOfIncome" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500">
                            @foreach($sourceOfIncomeList ?? [] as $source)
                            <option value="{{ $source->Value ?? $source }}" {{ ($formData->SourceOfIncome ?? '') == ($source->Value ?? $source) ? 'selected' : '' }}>{{ $source->Text ?? $source }}</option>
                            @endforeach
                        </select>
                    </div>

                    <!-- Business Name Confirmation -->
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Need Business Name</label>
                        <div class="flex items-center mt-2">
                            <input type="checkbox" name="needBusinessName" id="needBusinessName" class="h-4 w-4 text-teal-600 border-gray-300 rounded focus:ring-teal-500" {{ ($formData->needBusinessName ?? false) ? 'checked' : '' }}>
                            <label for="needBusinessName" class="ml-2 text-sm text-gray-700">Yes, I need business name confirmation</label>
                        </div>
                    </div>
                </div>

                <div class="mt-6">
                    <label class="block text-sm font-medium text-gray-700 mb-1">Certificate Notes <span class="text-red-500">*</span></label>
                    <textarea name="CertificateNotes" id="CertificateNotes" rows="3" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500" placeholder="Enter certificate notes" required>{{ $formData->CertificateNotes ?? '' }}</textarea>
                </div>

                <div class="mt-6">
                    <label class="block text-sm font-medium text-gray-700 mb-1">Notes</label>
                    <textarea name="Notes" id="Notes" rows="3" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500" placeholder="Enter notes">{{ $formData->Notes ?? '' }}</textarea>
                </div>
            </div>

            <div class="px-6 py-4 bg-gray-50 border-t border-gray-200 flex justify-end space-x-3">
                <button type="submit" name="btnAction" value="Save" class="px-6 py-2 bg-gray-600 text-white font-medium rounded-lg hover:bg-gray-700 transition-colors">
                    Save
                </button>
                <button type="submit" name="btnApproveValidateAction" value="Submit" class="px-6 py-2 bg-teal-600 text-white font-medium rounded-lg hover:bg-teal-700 transition-colors">
                    Approve
                </button>
            </div>
        </form>
    </div>

    <!-- Internal Notes Section -->
    @include('pages.admin.operation-manager.partials.tcc-internal-notes', ['requestId' => $requestData->TCCRequestID, 'requestNotesList' => $requestNotesList ?? []])
</div>

<!-- Add Income Stream Modal -->
<div id="incomeStreamModal" class="hidden fixed inset-0 z-50 overflow-y-auto">
    <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" onclick="closeIncomeStreamModal()"></div>
        <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-white px-6 py-4 border-b border-gray-200">
                <div class="flex items-center justify-between">
                    <h3 class="text-lg font-semibold text-gray-900">Add Income Stream</h3>
                    <button onclick="closeIncomeStreamModal()" class="text-gray-400 hover:text-gray-600 transition-colors">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                            <path d="M18 6L6 18M6 6l12 12"/>
                        </svg>
                    </button>
                </div>
            </div>

            <div id="incomeStreamModalError" class="hidden mx-6 mt-4 p-3 bg-red-50 border border-red-200 text-red-700 rounded-lg text-sm"></div>

            <form id="frmAddIncomeStream">
                @csrf
                <div class="bg-white px-6 py-4 space-y-4">
                    <div class="grid grid-cols-2 gap-4">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">Tax Year <span class="text-red-500">*</span></label>
                            <select name="TaxYear" id="cboTaxYear" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500" required>
                                <option value="">Select Tax Year</option>
                                @foreach($yearList ?? [] as $year)
                                <option value="{{ is_array($year) ? $year['id'] : $year }}">{{ is_array($year) ? $year['text'] : $year }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">Total Income Earned <span class="text-red-500">*</span></label>
                            <input type="number" name="TotalIncomeEarned" id="txtTotalIncomeEarned" step="0.01" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500" placeholder="Enter total income" required>
                        </div>
                    </div>
                    <div class="grid grid-cols-2 gap-4">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">Tax Payer Business <span class="text-red-500">*</span></label>
                            <select name="BusinessID" id="cboBusinessID" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500" required>
                                <option value="">Select Business</option>
                                @foreach($taxBusinessList ?? [] as $business)
                                <option value="{{ $business->BusinessID }}">{{ $business->BusinessName }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">Tax Payer Role <span class="text-red-500">*</span></label>
                            <select name="TaxPayerRoleID" id="cboTaxPayerRoleID" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500" required>
                                <option value="">Select Role</option>
                                @foreach($taxPayerRoleList ?? [] as $role)
                                <option value="{{ $role->TaxPayerRoleID }}">{{ $role->TaxPayerRoleName }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Notes</label>
                        <textarea name="Notes" id="txtIncomeNotes" rows="3" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500" placeholder="Enter notes"></textarea>
                    </div>
                </div>

                <div class="bg-gray-50 px-6 py-4 flex justify-end space-x-3">
                    <button type="button" onclick="closeIncomeStreamModal()" class="px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 transition-colors">Cancel</button>
                    <button type="submit" id="btnSaveIncomeStream" class="px-4 py-2 text-sm font-medium text-white bg-teal-600 rounded-lg hover:bg-teal-700 transition-colors">Save</button>
                </div>
            </form>
        </div>
    </div>
</div>
<!-- Building Details Modal -->
<div id="dvBuildingModal" class="hidden fixed inset-0 z-50 overflow-y-auto">
    <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" onclick="closeBuildingModal()"></div>
        <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-teal-600 px-6 py-4">
                <div class="flex items-center justify-between">
                    <h3 class="text-lg font-semibold text-white">Building Details</h3>
                    <button onclick="closeBuildingModal()" class="text-white hover:text-gray-200"><svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg></button>
                </div>
            </div>
            <div class="px-6 py-4 max-h-96 overflow-y-auto">
                <dl class="grid grid-cols-2 gap-3 text-sm">
                    <div><dt class="font-medium text-gray-500">Building RIN</dt><dd id="dvBuildingRIN" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Tag Number</dt><dd id="dvBuildingTagNumber" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Building Name</dt><dd id="dvBuildingName" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Building Number</dt><dd id="dvBuildingNumber" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Street Name</dt><dd id="dvBuildStreetName" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Off Street Name</dt><dd id="dvBuildOffStreetName" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Town</dt><dd id="dvBuildTown" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">LGA</dt><dd id="dvBuildLGA" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Ward</dt><dd id="dvBuildWard" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Building Type</dt><dd id="dvBuildingType" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Completion</dt><dd id="dvBuildingCompletion" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Purpose</dt><dd id="dvBuildingPurpose" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Function</dt><dd id="dvBuildingFunction" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Ownership</dt><dd id="dvBuildingOwnership" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Status</dt><dd id="dvBuildingStatus" class="text-gray-900">-</dd></div>
                </dl>
            </div>
        </div>
    </div>
</div>

<!-- Vehicle Details Modal -->
<div id="dvVehicleModal" class="hidden fixed inset-0 z-50 overflow-y-auto">
    <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" onclick="closeVehicleModal()"></div>
        <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-teal-600 px-6 py-4">
                <div class="flex items-center justify-between">
                    <h3 class="text-lg font-semibold text-white">Vehicle Details</h3>
                    <button onclick="closeVehicleModal()" class="text-white hover:text-gray-200"><svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg></button>
                </div>
            </div>
            <div class="px-6 py-4 max-h-96 overflow-y-auto">
                <dl class="grid grid-cols-2 gap-3 text-sm">
                    <div><dt class="font-medium text-gray-500">Vehicle RIN</dt><dd id="dvVehicleRIN" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Reg Number</dt><dd id="dvVehicleRegNumber" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">VIN</dt><dd id="dvVIN" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Vehicle Type</dt><dd id="dvVehicleType" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Sub Type</dt><dd id="dvVehicleSubType" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">LGA</dt><dd id="dvVLGA" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Purpose</dt><dd id="dvVehiclePurpose" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Function</dt><dd id="dvVehicleFunction" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Ownership</dt><dd id="dvVehicleOwnership" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Status</dt><dd id="dvVStatus" class="text-gray-900">-</dd></div>
                </dl>
            </div>
        </div>
    </div>
</div>

<!-- Business Details Modal -->
<div id="dvBusinessModal" class="hidden fixed inset-0 z-50 overflow-y-auto">
    <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" onclick="closeBusinessModal()"></div>
        <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-teal-600 px-6 py-4">
                <div class="flex items-center justify-between">
                    <h3 class="text-lg font-semibold text-white">Business Details</h3>
                    <button onclick="closeBusinessModal()" class="text-white hover:text-gray-200"><svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg></button>
                </div>
            </div>
            <div class="px-6 py-4 max-h-96 overflow-y-auto">
                <dl class="grid grid-cols-2 gap-3 text-sm">
                    <div><dt class="font-medium text-gray-500">Business RIN</dt><dd id="dvBusinessRIN" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Business Name</dt><dd id="dvBusinessName" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Business Type</dt><dd id="dvBusinessType" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">LGA</dt><dd id="dvBusinessLGA" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Category</dt><dd id="dvBusinessCategory" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Sector</dt><dd id="dvBusinessSector" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Sub Sector</dt><dd id="dvBusinessSubSector" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Structure</dt><dd id="dvBusinessStructure" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Operations</dt><dd id="dvBusinessOperations" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Contact Name</dt><dd id="dvContactName" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Business Number</dt><dd id="dvBusinessNumber" class="text-gray-900">-</dd></div>
                    <div class="col-span-2"><dt class="font-medium text-gray-500">Address</dt><dd id="dvBusinessAddress" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Status</dt><dd id="dvBusinessStatus" class="text-gray-900">-</dd></div>
                </dl>
            </div>
        </div>
    </div>
</div>

<!-- Land Details Modal -->
<div id="dvLandModal" class="hidden fixed inset-0 z-50 overflow-y-auto">
    <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" onclick="closeLandModal()"></div>
        <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-teal-600 px-6 py-4">
                <div class="flex items-center justify-between">
                    <h3 class="text-lg font-semibold text-white">Land Details</h3>
                    <button onclick="closeLandModal()" class="text-white hover:text-gray-200"><svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg></button>
                </div>
            </div>
            <div class="px-6 py-4 max-h-96 overflow-y-auto">
                <dl class="grid grid-cols-2 gap-3 text-sm">
                    <div><dt class="font-medium text-gray-500">Land RIN</dt><dd id="dvLandRIN" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Street Name</dt><dd id="dvLandStreetName" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Town</dt><dd id="dvLandTown" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">LGA</dt><dd id="dvLandLGA" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Ward</dt><dd id="dvLandWard" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Size (Length)</dt><dd id="dvLandSize_Length" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Size (Width)</dt><dd id="dvLandSize_Width" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">C of O Ref</dt><dd id="dvC_OF_O_Ref" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Purpose</dt><dd id="dvLandPurpose" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Ownership</dt><dd id="dvLandOwnership" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Latitude</dt><dd id="dvLandLatitude" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Longitude</dt><dd id="dvLandLongitude" class="text-gray-900">-</dd></div>
                    <div><dt class="font-medium text-gray-500">Status</dt><dd id="dvLandStatus" class="text-gray-900">-</dd></div>
                </dl>
            </div>
        </div>
    </div>
</div>

<!-- PAYE Income Stream Edit Modal (matches .NET dvPAYEIncomeStreamModal) -->
<div id="dvPAYEIncomeStreamModal" class="hidden fixed inset-0 z-50 overflow-y-auto">
    <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" onclick="closePayeIncomeStreamModal()"></div>
        <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-teal-600 px-6 py-4">
                <div class="flex items-center justify-between">
                    <h3 class="text-lg font-semibold text-white" id="dvPAYEIncomeStreamModalLabel">Edit Paye Income Stream</h3>
                    <button onclick="closePayeIncomeStreamModal()" class="text-white hover:text-gray-200">
                        <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
                        </svg>
                    </button>
                </div>
            </div>
            <div class="px-6 py-4">
                <input type="hidden" id="hdnPayeISRowID" value="0">
                <div id="dvPayeAISMessage"></div>
                <form id="frmEditPayeIncomeStream">
                    <div class="grid grid-cols-2 gap-4">
                        <div>
                            <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Receipt Ref <span class="text-red-500">*</span></label>
                            <input type="text" id="txtPayeReceiptRef" name="txtPayeReceiptRef" placeholder="Enter Receipt Ref" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                        </div>
                        <div>
                            <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Receipt Date <span class="text-red-500">*</span></label>
                            <input type="date" id="txtPayeReceiptDate" name="txtPayeReceiptDate" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                        </div>
                    </div>
                    <div class="mt-4">
                        <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Assessable Income <span class="text-red-500">*</span></label>
                        <input type="number" id="txtTotalpayeIncomeEarned" name="txtTotalpayeIncomeEarned" placeholder="Enter Total Assessable Income" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                    </div>
                    <div class="grid grid-cols-2 gap-4 mt-4">
                        <div>
                            <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Paye Assessed Amount <span class="text-red-500">*</span></label>
                            <input type="number" id="txtpayeAssessedIncome" name="txtpayeAssessedIncome" placeholder="Enter Paye Assessed Income" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                        </div>
                        <div>
                            <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Paye Tax Paid <span class="text-red-500">*</span></label>
                            <input type="number" id="txtpayeTaxPaid" name="txtpayeTaxPaid" placeholder="Enter Paye Tax Paid" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                        </div>
                    </div>
                </form>
            </div>
            <div class="bg-gray-50 px-6 py-3 flex justify-end space-x-3">
                <button type="button" onclick="closePayeIncomeStreamModal()" class="px-4 py-2 bg-gray-200 text-gray-800 rounded-lg hover:bg-gray-300 transition-colors text-sm font-medium">Close</button>
                <button type="button" id="btSavePayeIncomeStream" onclick="savePayeIncomeStream()" class="px-4 py-2 bg-teal-600 text-white rounded-lg hover:bg-teal-700 transition-colors text-sm font-medium">Save</button>
            </div>
        </div>
    </div>
</div>

<!-- Direct Assessment Income Stream Edit Modal (matches .NET dvIncomeStreamModal) -->
<div id="dvIncomeStreamModal" class="hidden fixed inset-0 z-50 overflow-y-auto">
    <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" onclick="closeIncomeStreamEditModal()"></div>
        <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
            <div class="bg-teal-600 px-6 py-4">
                <div class="flex items-center justify-between">
                    <h3 class="text-lg font-semibold text-white" id="dvIncomeStreamModalLabel">Edit Income Stream</h3>
                    <button onclick="closeIncomeStreamEditModal()" class="text-white hover:text-gray-200">
                        <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
                        </svg>
                    </button>
                </div>
            </div>
            <div class="px-6 py-4">
                <input type="hidden" id="hdnISRowID" value="0">
                <div id="dvISMessage"></div>
                <form id="frmEditIncomeStream">
                    <div class="grid grid-cols-2 gap-4">
                        <div>
                            <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Year <span class="text-red-500">*</span></label>
                            <select id="cboEditTaxYear" name="cboTaxYear" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                                <option value="">Select Tax Year</option>
                                @for($y = date('Y'); $y >= 2010; $y--)
                                <option value="{{ $y }}">{{ $y }}</option>
                                @endfor
                            </select>
                        </div>
                        <div>
                            <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Total Income Earned <span class="text-red-500">*</span></label>
                            <input type="number" id="txtEditTotalIncomeEarned" name="txtTotalIncomeEarned" placeholder="Enter Total Income Earned" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                        </div>
                    </div>
                    <div class="grid grid-cols-2 gap-4 mt-4">
                        <div>
                            <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Payer Business <span class="text-red-500">*</span></label>
                            <select id="cboEditBusinessID" name="cboBusinessID" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                                <option value="">Select Asset</option>
                            </select>
                        </div>
                        <div>
                            <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Tax Payer Role <span class="text-red-500">*</span></label>
                            <select id="cboEditTaxPayerRoleID" name="cboTaxPayerRoleID" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm">
                                <option value="">Select Tax Payer Role</option>
                                @foreach($taxPayerRoleList ?? [] as $role)
                                <option value="{{ $role->TaxPayerRoleID }}">{{ $role->TaxPayerRoleName }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="mt-4">
                        <label class="block text-xs font-medium text-gray-500 uppercase tracking-wider mb-1">Notes</label>
                        <textarea id="txtEditNotes" name="txtNotes" rows="3" placeholder="Enter Notes" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-teal-500 focus:border-teal-500 text-sm"></textarea>
                    </div>
                </form>
            </div>
            <div class="bg-gray-50 px-6 py-3 flex justify-end space-x-3">
                <button type="button" onclick="closeIncomeStreamEditModal()" class="px-4 py-2 bg-gray-200 text-gray-800 rounded-lg hover:bg-gray-300 transition-colors text-sm font-medium">Close</button>
                <button type="button" id="btSaveIncomeStream" onclick="saveIncomeStream()" class="px-4 py-2 bg-teal-600 text-white rounded-lg hover:bg-teal-700 transition-colors text-sm font-medium">Save</button>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
$(document).ready(function() {
    // Income Stream Modal Functions
    window.openIncomeStreamModal = function() {
        $('#frmAddIncomeStream')[0].reset();
        $('#incomeStreamModalError').addClass('hidden');
        $('#incomeStreamModal').removeClass('hidden');
    };

    window.closeIncomeStreamModal = function() {
        $('#incomeStreamModal').addClass('hidden');
    };

    // Add Income Stream Form
    $('#frmAddIncomeStream').on('submit', function(e) {
        e.preventDefault();
        $('#btnSaveIncomeStream').prop('disabled', true).text('Saving...');

        $.ajax({
            url: '{{ route("process-tcc-request.add-income-stream", $requestData->TCCRequestID) }}',
            type: 'POST',
            data: $(this).serialize(),
            success: function(response) {
                $('#btnSaveIncomeStream').prop('disabled', false).text('Save');
                if (response.success) {
                    closeIncomeStreamModal();
                    location.reload();
                } else {
                    $('#incomeStreamModalError').text(response.message || 'Failed to save income stream').removeClass('hidden');
                }
            },
            error: function(xhr) {
                $('#btnSaveIncomeStream').prop('disabled', false).text('Save');
                let errorMsg = 'Error saving income stream';
                if (xhr.responseJSON && xhr.responseJSON.message) {
                    errorMsg = xhr.responseJSON.message;
                }
                $('#incomeStreamModalError').text(errorMsg).removeClass('hidden');
            }
        });
    });

    // Delete Income Stream
    window.deleteIncomeStream = function(rowId) {
        if (!confirm('Are you sure you want to remove this income stream?')) {
            return;
        }

        $.ajax({
            url: '{{ route("process-tcc-request.delete-income-stream", $requestData->TCCRequestID) }}',
            type: 'POST',
            data: {
                _token: '{{ csrf_token() }}',
                RowID: rowId
            },
            success: function(response) {
                if (response.success) {
                    location.reload();
                } else {
                    alert(response.message || 'Failed to remove income stream');
                }
            },
            error: function(xhr) {
                alert('Error removing income stream');
            }
        });
    };

    // Show Asset Details - Matches .NET jsfn_ShowAssetDetails
    window.showAssetDetails = function(tpaid) {
        $.ajax({
            url: '{{ route("capture.individual.get-asset-details") }}',
            type: 'GET',
            data: { TPAID: tpaid },
            success: function(data) {
                if (data.success) {
                    var details = data.AssetDetails;
                    if (data.AssetTypeID == 1) {
                        // Building
                        $('#dvBuildingModal').removeClass('hidden');
                        $('#dvBuildingRIN').text(details.BuildingRIN || '-');
                        $('#dvBuildingTagNumber').text(details.BuildingTagNumber || '-');
                        $('#dvBuildingName').text(details.BuildingName || '-');
                        $('#dvBuildingNumber').text(details.BuildingNumber || '-');
                        $('#dvBuildStreetName').text(details.StreetName || '-');
                        $('#dvBuildOffStreetName').text(details.OffStreetName || '-');
                        $('#dvBuildTown').text(details.TownName || '-');
                        $('#dvBuildLGA').text(details.LGAName || '-');
                        $('#dvBuildWard').text(details.WardName || '-');
                        $('#dvBuildingType').text(details.BuildingTypeName || '-');
                        $('#dvBuildingCompletion').text(details.BuildingCompletionName || '-');
                        $('#dvBuildingPurpose').text(details.BuildingPurposeName || '-');
                        $('#dvBuildingFunction').text(details.BuildingFunctionNames || '-');
                        $('#dvBuildingOwnership').text(details.BuildingOwnershipName || '-');
                        $('#dvBuildingStatus').text(details.ActiveText || '-');
                    } else if (data.AssetTypeID == 2) {
                        // Vehicle
                        $('#dvVehicleModal').removeClass('hidden');
                        $('#dvVehicleRIN').text(details.VehicleRIN || '-');
                        $('#dvVehicleRegNumber').text(details.VehicleRegNumber || '-');
                        $('#dvVIN').text(details.VIN || '-');
                        $('#dvVehicleType').text(details.VehicleTypeName || '-');
                        $('#dvVehicleSubType').text(details.VehicleSubTypeName || '-');
                        $('#dvVLGA').text(details.LGAName || '-');
                        $('#dvVehiclePurpose').text(details.VehiclePurposeName || '-');
                        $('#dvVehicleFunction').text(details.VehicleFunctionName || '-');
                        $('#dvVehicleOwnership').text(details.VehicleOwnershipName || '-');
                        $('#dvVStatus').text(details.ActiveText || '-');
                    } else if (data.AssetTypeID == 3) {
                        // Business
                        $('#dvBusinessModal').removeClass('hidden');
                        $('#dvBusinessRIN').text(details.BusinessRIN || '-');
                        $('#dvBusinessName').text(details.BusinessName || '-');
                        $('#dvBusinessType').text(details.BusinessTypeName || '-');
                        $('#dvBusinessLGA').text(details.LGAName || '-');
                        $('#dvBusinessCategory').text(details.BusinessCategoryName || '-');
                        $('#dvBusinessSector').text(details.BusinessSectorName || '-');
                        $('#dvBusinessSubSector').text(details.BusinessSubSectorName || '-');
                        $('#dvBusinessStructure').text(details.BusinessStructureName || '-');
                        $('#dvBusinessOperations').text(details.BusinessOperationName || '-');
                        $('#dvContactName').text(details.ContactName || '-');
                        $('#dvBusinessNumber').text(details.BusinessNumber || '-');
                        $('#dvBusinessAddress').text(details.BusinessAddress || '-');
                        $('#dvBusinessStatus').text(details.ActiveText || '-');
                    } else if (data.AssetTypeID == 4) {
                        // Land
                        $('#dvLandModal').removeClass('hidden');
                        $('#dvLandRIN').text(details.LandRIN || '-');
                        $('#dvLandStreetName').text(details.StreetName || '-');
                        $('#dvLandTown').text(details.TownName || '-');
                        $('#dvLandLGA').text(details.LGAName || '-');
                        $('#dvLandWard').text(details.WardName || '-');
                        $('#dvLandSize_Length').text(details.LandSize_Length || '-');
                        $('#dvLandSize_Width').text(details.LandSize_Width || '-');
                        $('#dvC_OF_O_Ref').text(details.C_OF_O_Ref || '-');
                        $('#dvLandPurpose').text(details.LandPurposeName || '-');
                        $('#dvLandOwnership').text(details.LandOwnershipName || '-');
                        $('#dvLandLatitude').text(details.Latitude || '-');
                        $('#dvLandLongitude').text(details.Longitude || '-');
                        $('#dvLandStatus').text(details.ActiveText || '-');
                    }
                } else {
                    alert(data.message || 'Error loading asset details');
                }
            },
            error: function() {
                alert('Error loading asset details');
            }
        });
    };

    // Modal close functions
    window.closeBuildingModal = function() { $('#dvBuildingModal').addClass('hidden'); };
    window.closeVehicleModal = function() { $('#dvVehicleModal').addClass('hidden'); };
    window.closeBusinessModal = function() { $('#dvBusinessModal').addClass('hidden'); };
    window.closeLandModal = function() { $('#dvLandModal').addClass('hidden'); };
    window.closePayeIncomeStreamModal = function() { $('#dvPAYEIncomeStreamModal').addClass('hidden'); };
    window.closeIncomeStreamEditModal = function() { $('#dvIncomeStreamModal').addClass('hidden'); };

    // Save PAYE Income Stream (from modal)
    window.savePayeIncomeStream = function() {
        var vData = {
            _token: '{{ csrf_token() }}',
            RowID: $("#hdnPayeISRowID").val(),
            TaxYear: $("#cboPayeTaxYear").val(),
            TotalIncomeEarned: $("#txtTotalpayeIncomeEarned").val(),
            ReceiptDate: $("#txtPayeReceiptDate").val(),
            ReceiptReference: $("#txtPayeReceiptRef").val(),
            payeTaxPaid: $("#txtpayeTaxPaid").val(),
            payeAssessedIncome: $("#txtpayeAssessedIncome").val()
        };

        $.ajax({
            url: '{{ route("process-tcc-request.add-update-paye-income-stream") }}',
            type: 'POST',
            data: vData,
            success: function(response) {
                if (response.success) {
                    closePayeIncomeStreamModal();
                    location.reload();
                } else {
                    alert(response.Message || 'Error saving PAYE income stream');
                }
            },
            error: function() {
                alert('Error saving PAYE income stream');
            }
        });
    };

    // Save Income Stream (from Edit modal - uses Edit modal IDs)
    window.saveIncomeStream = function() {
        var vData = {
            _token: '{{ csrf_token() }}',
            RowID: $("#hdnISRowID").val(),
            TaxYear: $("#cboEditTaxYear").val(),
            TotalIncomeEarned: $("#txtEditTotalIncomeEarned").val(),
            TaxPayerRoleID: $("#cboEditTaxPayerRoleID").val(),
            BusinessID: $("#cboEditBusinessID").val(),
            Notes: $("#txtEditNotes").val(),
            tpid: $('#hdnTaxPayerID').val() || '0',
            tptid: $('#hdnTaxPayerTypeID').val() || '1'
        };

        $.ajax({
            url: '{{ route("process-tcc-request.add-update-income-stream") }}',
            type: 'POST',
            data: vData,
            success: function(response) {
                if (response.success) {
                    closeIncomeStreamEditModal();
                    location.reload();
                } else {
                    alert(response.Message || 'Error saving income stream');
                }
            },
            error: function() {
                alert('Error saving income stream');
            }
        });
    };
});

// ============================================
// Income Stream Functions - Matches .NET jsValidateTaxPayerIncomeDetails.js
// ============================================

/**
 * Edit Income Stream (Direct Assessment)
 * Matches .NET: jsfn_EditIncomeStream()
 */
function jsfn_EditIncomeStream(RowID) {
    var vTaxPayerTypeID = $('#hdnTaxPayerTypeID').val() || '1';
    var vTaxPayerID = $('#hdnTaxPayerID').val() || '0';

    var vData = {
        _token: '{{ csrf_token() }}',
        RowID: RowID === '' ? 0 : RowID,
        tpid: vTaxPayerID === '' ? 0 : vTaxPayerID,
        tptid: vTaxPayerTypeID === '' ? 0 : vTaxPayerTypeID,
    };

    $.ajax({
        url: '{{ route("process-tcc-request.get-income-stream-details") }}',
        type: 'POST',
        data: vData,
        success: function(data) {
            if (data.success === true) {
                // Populate asset dropdown (using Edit modal IDs)
                $("#cboEditBusinessID").empty();
                $("#cboEditBusinessID").append('<option value="">Select Asset</option>');
                $.each(data.AssetList, function(i, ast) {
                    // Handle both formats: {id, text} or {AssetID, AssetName}
                    var assetId = ast.AssetID || ast.id;
                    var assetName = ast.AssetName || ast.text;
                    $("#cboEditBusinessID").append('<option value="' + assetId + '">' + assetName + '</option>');
                });

                // Populate form fields (using Edit modal IDs)
                $("#hdnISRowID").val(data.IncomeStreamData.RowID);
                $("#cboEditTaxYear").val(data.IncomeStreamData.TaxYear);
                $("#txtEditTotalIncomeEarned").val(data.IncomeStreamData.TotalIncomeEarned);
                $("#cboEditTaxPayerRoleID").val(data.IncomeStreamData.TaxPayerRoleID);
                $("#cboEditBusinessID").val(data.IncomeStreamData.BusinessID);
                $("#txtEditNotes").val(data.IncomeStreamData.Notes);

                // Update button text and modal title
                $("#btSaveIncomeStream").html('Update');
                $("#dvIncomeStreamModalLabel").html('Edit Income Stream');

                // Show modal
                $("#dvIncomeStreamModal").removeClass('hidden');
            } else {
                alert(data.Message || 'Error loading income stream details');
            }
        },
        error: function() {
            alert('Error loading income stream details');
        }
    });
}

/**
 * Delete Income Stream (Direct Assessment)
 * Matches .NET: jsfn_DeleteIncomeStream()
 */
function jsfn_DeleteIncomeStream(RowID) {
    if (!confirm('Are you sure you want to remove this income stream?')) {
        return;
    }

    var vData = {
        _token: '{{ csrf_token() }}',
        RowID: RowID === '' ? 0 : RowID
    };

    $.ajax({
        url: '{{ route("process-tcc-request.delete-income-stream", $requestData->TCCRequestID) }}',
        type: 'POST',
        data: vData,
        success: function(data) {
            if (data.success === true) {
                // Reload page to reflect changes
                location.reload();
            } else {
                alert(data.message || data.Message || 'Error removing income stream');
            }
        },
        error: function() {
            alert('Error removing income stream');
        }
    });
}

/**
 * Edit PAYE Income Stream
 * Matches .NET: jsfn_EditPAYEIncomeStream()
 */
function jsfn_EditPAYEIncomeStream(RowID) {
    var vData = {
        _token: '{{ csrf_token() }}',
        RowID: RowID === '' ? 0 : RowID
    };

    $.ajax({
        url: '{{ route("process-tcc-request.get-paye-income-stream-details") }}',
        type: 'POST',
        data: vData,
        success: function(data) {
            if (data.success === true) {
                // Populate form fields
                $("#hdnPayeISRowID").val(data.IncomeStreamData.RowID);
                $("#cboPayeTaxYear").val(data.IncomeStreamData.TaxYear || data.IncomeStreamData.AssessmentYear);
                $("#txtTotalpayeIncomeEarned").val(data.IncomeStreamData.ChargeableIncome);
                $("#txtPayeReceiptRef").val(data.IncomeStreamData.ReceiptRef);
                $("#txtPayeReceiptDate").val(data.IncomeStreamData.ReceiptDate);
                $("#txtpayeAssessedIncome").val(data.IncomeStreamData.AnnualTax);
                $("#txtpayeTaxPaid").val(data.IncomeStreamData.AnnualTaxII || data.IncomeStreamData.AnnualTax);

                // Update button text and modal title
                $("#btSavePayeIncomeStream").html('Update');
                $("#dvPAYEIncomeStreamModalLabel").html('Edit Paye Income Stream');

                // Show modal
                $("#dvPAYEIncomeStreamModal").removeClass('hidden');
            } else {
                alert(data.Message || 'Error loading PAYE income stream details');
            }
        },
        error: function() {
            alert('Error loading PAYE income stream details');
        }
    });
}

/**
 * Delete PAYE Income Stream
 * Matches .NET: jsfn_DeletePayeIncomeStream()
 */
function jsfn_DeletePayeIncomeStream(RowID) {
    if (!confirm('Are you sure you want to remove this PAYE income stream?')) {
        return;
    }

    var vData = {
        _token: '{{ csrf_token() }}',
        RowID: RowID === '' ? 0 : RowID
    };

    $.ajax({
        url: '{{ route("process-tcc-request.delete-paye-income-stream") }}',
        type: 'POST',
        data: vData,
        success: function(data) {
            if (data.success === true) {
                // Reload page to reflect changes
                location.reload();
            } else {
                alert(data.Message || 'Error removing PAYE income stream');
            }
        },
        error: function() {
            alert('Error removing PAYE income stream');
        }
    });
}
</script>
@endpush