@php
    $isReadOnly = in_array($kycProcess->status, ['completed', 'approved', 'rejected']);
@endphp

<div class="max-w-4xl mx-auto bg-white p-8">
    <div class="text-center mb-8">
        <h1 class="text-3xl font-bold text-gray-900 mb-2">A - CORPORATIONS AND PARTNERSHIPS</h1>
        <p class="text-sm text-gray-600 italic">
            @if($isReadOnly)
                (Form data displayed for review purposes - KYC Status: {{ ucfirst($kycProcess->status) }})
            @else
                (Please complete all fields, inserting N/A if not applicable. Documentation supporting all information must be provided)
            @endif
        </p>
    </div>

    <form wire:submit.prevent="submitForm" class="space-y-8">
        @if($isAdminAccess)
            <div class="bg-blue-50 border border-blue-200 rounded-md p-4 mb-6">
                <div class="flex items-center justify-between">
                    <div class="flex items-center">
                        <svg class="h-5 w-5 text-blue-500 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
                        </svg>
                        <span class="text-sm font-medium text-blue-800">Admin Access - File Downloads Available</span>
                    </div>
                    <a href="{{ route('kyc.admin.download.all', ['kycProcess' => $kycProcess->uuid]) }}" 
                       class="px-4 py-2 bg-blue-600 text-white text-sm rounded hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500">
                        Download All Files
                    </a>
                </div>
            </div>
        @endif
        @if($isReadOnly)
            <div class="bg-yellow-50 border border-yellow-200 rounded-md p-4 mb-6">
                <div class="flex">
                    <div class="flex-shrink-0">
                        <svg class="h-5 w-5 text-yellow-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z"></path>
                        </svg>
                    </div>
                    <div class="ml-3">
                        <p class="text-sm font-medium text-yellow-800">Read-Only Mode</p>
                        <p class="text-sm text-yellow-700 mt-1">This form is displayed for review purposes only. No changes can be made.</p>
                    </div>
                </div>
            </div>
        @endif
        <!-- 1. Identification -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">1. Identification</h2>
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <div>
                    <label for="corporate_name" class="block text-sm font-medium text-gray-700 mb-2">Corporate Name</label>
                    <input type="text" id="corporate_name" wire:model="formData.corporate_name" 
                           @if($isReadOnly) readonly @endif
                           class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 @if($isReadOnly) bg-gray-100 cursor-not-allowed @endif">
                    @error('formData.corporate_name') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="corporate_purpose" class="block text-sm font-medium text-gray-700 mb-2">Corporate Purpose</label>
                    <textarea id="corporate_purpose" wire:model="formData.corporate_purpose" rows="3"
                              class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"></textarea>
                    @error('formData.corporate_purpose') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="registered_address" class="block text-sm font-medium text-gray-700 mb-2">Registered Address</label>
                    <textarea id="registered_address" wire:model="formData.registered_address" rows="3"
                              class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"></textarea>
                    @error('formData.registered_address') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="place_of_incorporation" class="block text-sm font-medium text-gray-700 mb-2">Place of Incorporation</label>
                    <input type="text" id="place_of_incorporation" wire:model="formData.place_of_incorporation" 
                           class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                    @error('formData.place_of_incorporation') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="registration_no" class="block text-sm font-medium text-gray-700 mb-2">Registration No.</label>
                    <input type="text" id="registration_no" wire:model="formData.registration_no" 
                           class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                    @error('formData.registration_no') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="tax_id" class="block text-sm font-medium text-gray-700 mb-2">Tax Identification Number (Tax ID)</label>
                    <input type="text" id="tax_id" wire:model="formData.tax_id" 
                           class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                    @error('formData.tax_id') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="vat_number" class="block text-sm font-medium text-gray-700 mb-2">V.A.T. Number</label>
                    <input type="text" id="vat_number" wire:model="formData.vat_number" 
                           class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                    @error('formData.vat_number') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="stock_exchange_listings" class="block text-sm font-medium text-gray-700 mb-2">Stock Exchange Listing(s)</label>
                    <input type="text" id="stock_exchange_listings" wire:model="formData.stock_exchange_listings" 
                           class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                    @error('formData.stock_exchange_listings') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
            </div>
        </div>

        <!-- 2. Ownership - 5% share or more -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">2. Ownership - 5% share or more or equivalent voting rights (add additional page if needed)</h2>
            
            <div class="mb-4">
                @foreach($formData['ownership_details'] as $index => $ownership)
                <div class="border border-gray-200 p-4 rounded-md mb-4">
                    <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Full [Corporate] Name</label>
                            <input type="text" wire:model="formData.ownership_details.{{ $index }}.name" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.ownership_details.{$index}.name") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Place of Incorporation/Nationality</label>
                            <input type="text" wire:model="formData.ownership_details.{{ $index }}.place_of_incorporation" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.ownership_details.{$index}.place_of_incorporation") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Tax ID</label>
                            <input type="text" wire:model="formData.ownership_details.{{ $index }}.tax_id" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.ownership_details.{$index}.tax_id") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Percentage of Ownership</label>
                            <input type="number" step="0.01" min="0" max="100" wire:model="formData.ownership_details.{{ $index }}.percentage" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.ownership_details.{$index}.percentage") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                    </div>
                    
                    @if(count($formData['ownership_details']) > 1)
                    <button type="button" wire:click="removeOwnership({{ $index }})" 
                            class="mt-2 text-red-600 hover:text-red-800 text-sm">Remove</button>
                    @endif
                </div>
                @endforeach
                
                <button type="button" wire:click="addOwnership" 
                        class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500">
                    Add Ownership Detail
                </button>
            </div>
        </div>

        <!-- 2.1 Additional information of individual shareholders -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">2.1 Additional information of individual shareholders (add additional page if needed)</h2>
            
            <div class="mb-4">
                @foreach($formData['individual_shareholders'] as $index => $shareholder)
                <div class="border border-gray-200 p-4 rounded-md mb-4">
                    <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Name</label>
                            <input type="text" wire:model="formData.individual_shareholders.{{ $index }}.name" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.individual_shareholders.{$index}.name") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Tax Address</label>
                            <input type="text" wire:model="formData.individual_shareholders.{{ $index }}.tax_address" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.individual_shareholders.{$index}.tax_address") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Nationality/ies</label>
                            <input type="text" wire:model="formData.individual_shareholders.{{ $index }}.nationality" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.individual_shareholders.{$index}.nationality") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Identification Document</label>
                            
                            <!-- Show existing file if available -->
                            @if(!empty($formData['individual_shareholders'][$index]['identification_document']) && is_string($formData['individual_shareholders'][$index]['identification_document']))
                                <div class="mb-2 p-2 bg-blue-50 border border-blue-200 rounded-md">
                                    <div class="flex items-center justify-between">
                                        <div class="flex items-center">
                                            <svg class="w-4 h-4 text-blue-600 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
                                            </svg>
                                            <span class="text-xs text-blue-700">{{ $formData['individual_shareholders'][$index]['identification_document'] }}</span>
                                        </div>
                                        @if($isAdminAccess)
                                            <a href="{{ route('kyc.admin.download.file', ['kycProcess' => $kycProcess->uuid, 'fileType' => 'shareholder_id', 'index' => $index]) }}" 
                                               target="_blank"
                                               class="inline-flex items-center px-3 py-1 text-xs font-medium text-blue-600 bg-blue-50 rounded-md hover:bg-blue-100 transition-colors duration-200">
                                                <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
                                                </svg>
                                                Open
                                            </a>
                                        @endif
                                    </div>
                                </div>
                            @endif
                            
                            <div class="file-upload-wrapper">
                                <input type="file" wire:model="individualShareholdersFiles.{{ $index }}.identification_document" 
                                       class="file-upload-input"
                                       accept=".pdf,.doc,.docx,.jpg,.jpeg,.png">
                                <div class="file-upload-button">
                                    <svg class="file-upload-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"></path>
                                    </svg>
                                    <span>{{ (!empty($formData['individual_shareholders'][$index]['identification_document']) && is_string($formData['individual_shareholders'][$index]['identification_document'])) ? 'Change File' : 'Choose File' }}</span>
                                </div>
                            </div>
                            @error("individualShareholdersFiles.{$index}.identification_document") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                    </div>
                    
                    @if(count($formData['individual_shareholders']) > 1)
                    <button type="button" wire:click="removeIndividualShareholder({{ $index }})" 
                            class="mt-2 text-red-600 hover:text-red-800 text-sm">Remove</button>
                    @endif
                </div>
                @endforeach
                
                <button type="button" wire:click="addIndividualShareholder" 
                        class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500">
                    Add Individual Shareholder
                </button>
            </div>
        </div>

        <!-- 3. Directors and Senior Management -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">3. Directors and Senior Management (add additional page if needed)</h2>
            
            <div class="mb-4">
                @foreach($formData['directors_management'] as $index => $director)
                <div class="border border-gray-200 p-4 rounded-md mb-4">
                    <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Full Name</label>
                            <input type="text" wire:model="formData.directors_management.{{ $index }}.full_name" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.directors_management.{$index}.full_name") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Tax Address</label>
                            <input type="text" wire:model="formData.directors_management.{{ $index }}.tax_address" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.directors_management.{$index}.tax_address") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Nationality/ies</label>
                            <input type="text" wire:model="formData.directors_management.{{ $index }}.nationality" 
                                   class="w-full h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                            @error("formData.directors_management.{$index}.nationality") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                        
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-2">Identification Document</label>
                            
                            <!-- Show existing file if available -->
                            @if(!empty($formData['directors_management'][$index]['identification_document']) && is_string($formData['directors_management'][$index]['identification_document']))
                                <div class="mb-2 p-2 bg-blue-50 border border-blue-200 rounded-md">
                                    <div class="flex items-center justify-between">
                                        <div class="flex items-center">
                                            <svg class="w-4 h-4 text-blue-600 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
                                            </svg>
                                            <span class="text-xs text-blue-700">{{ $formData['directors_management'][$index]['identification_document'] }}</span>
                                        </div>
                                        @if($isAdminAccess)
                                            <a href="{{ route('kyc.admin.download.file', ['kycProcess' => $kycProcess->uuid, 'fileType' => 'director_id', 'index' => $index]) }}" 
                                               target="_blank"
                                               class="inline-flex items-center px-3 py-1 text-xs font-medium text-blue-600 bg-blue-50 rounded-md hover:bg-blue-100 transition-colors duration-200">
                                                <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
                                                </svg>
                                                Open
                                            </a>
                                        @endif
                                    </div>
                                </div>
                            @endif
                            
                            <div class="file-upload-wrapper">
                                <input type="file" wire:model="directorsManagementFiles.{{ $index }}.identification_document" 
                                       class="file-upload-input"
                                       accept=".pdf,.doc,.docx,.jpg,.jpeg,.png">
                                <div class="file-upload-button">
                                    <svg class="file-upload-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"></path>
                                    </svg>
                                    <span>{{ (!empty($formData['directors_management'][$index]['identification_document']) && is_string($formData['directors_management'][$index]['identification_document'])) ? 'Change File' : 'Choose File' }}</span>
                                </div>
                            </div>
                            @error("directorsManagementFiles.{$index}.identification_document") <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                        </div>
                    </div>
                    
                    @if(count($formData['directors_management']) > 1)
                    <button type="button" wire:click="removeDirector({{ $index }})" 
                            class="mt-2 text-red-600 hover:text-red-800 text-sm">Remove</button>
                    @endif
                </div>
                @endforeach
                
                <button type="button" wire:click="addDirector" 
                        class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500">
                    Add Director/Manager
                </button>
            </div>
        </div>

        <!-- 4. Ultimate Beneficiary -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">4. Ultimate Beneficiary</h2>
            <p class="text-sm text-gray-600 mb-4">Is/are the entitiy/ies in 2./2.1 the ultimate beneficiary of the services to be rendered by the Firm?</p>
            
            <div class="space-y-3">
                <label class="flex items-center">
                    <input type="radio" wire:model="formData.ultimate_beneficiary" value="yes" class="mr-2">
                    <span>Yes</span>
                </label>
                <label class="flex items-center">
                    <input type="radio" wire:model="formData.ultimate_beneficiary" value="no" class="mr-2">
                    <span>No</span>
                </label>
            </div>
            
            @if($formData['ultimate_beneficiary'] === 'no')
            <div class="mt-4">
                <p class="text-sm text-gray-600 mb-2">If No, please complete (i) Form B for each individual and /or (ii) a similar copy of this form (Form A) for each intermediary corporate entity</p>
                <label for="ultimate_beneficiary_details" class="block text-sm font-medium text-gray-700 mb-2">Please specify:</label>
                <textarea id="ultimate_beneficiary_details" wire:model="formData.ultimate_beneficiary_details" rows="3"
                          class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"></textarea>
                @error('formData.ultimate_beneficiary_details') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
            </div>
            @endif
            @error('formData.ultimate_beneficiary') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
        </div>

        <!-- 5. Nature of transaction(s) -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">5. Nature of transaction(s) in which you will require our services:</h2>
            
            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                @foreach([
                    'The buying and selling of immovable assets, commercial establishments or shareholdings',
                    'The management of funds, securities or other assets',
                    'The opening and management of bank accounts, savings accounts or share-dealing accounts',
                    'The acquisition and disposal of rights over sports professionals',
                    'Other financial or real estate transactions',
                    'The setting-up, incorporation, exploration or management of companies, corporations, other corporate entities or unincorporated legal arrangements, involving the implementation of contributions and capital entries of any kind, as necessary',
                    'Incorporation or setting-up of companies, other corporate entities or unincorporated legal arrangements',
                    'Supply of registered offices, commercial or postal addresses, or other services related to companies, other corporate entities or unincorporated legal arrangements',
                    'Performance of director, secretary, partner or associate functions to a company or other corporate entity, as well as taking the necessary steps for another person to perform said functions',
                    'Performance of trustee functions to an express trust or of similar functions in an unincorporated arrangement of a similar nature, as well as taking the necessary steps for another person to perform said functions',
                    'Intervening as a nominee shareholder of a company not listed on a regulated market subject to information disclosure requirements under European Union law, or subject to equivalent international rules, as well as taking the necessary steps for another person to intervening in such capacity',
                    'Supply of other services relating to the representation, management and administration of companies, other corporate entities or legal arrangements',
                    'Legal services connected to the application in Portugal for citizenship or residency rights in exchange for the transfer of monies, acquisition of assets or public debt titles, as well as in exchange for the investment in corporate entities registered in national territory',
                    'Tax assistance and consultancy services',
                    'Other'
                ] as $transaction)
                <label class="flex items-start p-2 hover:bg-gray-100 rounded-md transition-colors">
                    <input type="checkbox" wire:model="formData.transaction_nature" value="{{ $transaction }}" class="mr-3 mt-1">
                    <span class="text-sm leading-relaxed">{{ $transaction }}</span>
                </label>
                @endforeach
            </div>
            
            @if(in_array('Other', $formData['transaction_nature'] ?? []))
            <div class="mt-6">
                <label for="transaction_nature_other" class="block text-sm font-medium text-gray-700 mb-2">Kindly, specify:</label>
                <input type="text" id="transaction_nature_other" wire:model="formData.transaction_nature_other" 
                       class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                @error('formData.transaction_nature_other') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
            </div>
            @endif
            @error('formData.transaction_nature') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
        </div>

        <!-- 6. Countries/Locations -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">6. State the countries / locations in which the above transaction(s) will be carried out:</h2>
            <textarea wire:model="formData.transaction_locations" rows="3"
                      class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"
                      placeholder="Please specify the countries and locations..."></textarea>
            @error('formData.transaction_locations') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
        </div>

        <!-- 7. Source of funds for transactions -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">7. State the source of the funds to be used in the transaction(s) and location of the relevant bank account from which such funds shall be paid:</h2>
            <textarea wire:model="formData.source_of_funds" rows="3"
                      class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"
                      placeholder="Please specify the source of funds..."></textarea>
            @error('formData.source_of_funds') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
            
            <div class="mt-4">
                <label for="source_of_funds_location" class="block text-sm font-medium text-gray-700 mb-2">Location of the relevant bank account from which such funds shall be paid</label>
                <input type="text" id="source_of_funds_location" wire:model="formData.source_of_funds_location" 
                       class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
                       placeholder="Bank name and location...">
                @error('formData.source_of_funds_location') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
            </div>
        </div>

        <!-- 8. Source of funds for fees -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">8. State the source of the funds to be used for payment of the Firm's fees and location of the relevant bank account from which such funds shall be paid:</h2>
            <textarea wire:model="formData.source_of_fees" rows="3"
                      class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"
                      placeholder="Please specify the source of funds for fees..."></textarea>
            @error('formData.source_of_fees') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
            
            <div class="mt-4">
                <label for="source_of_fees_location" class="block text-sm font-medium text-gray-700 mb-2">Location of the relevant bank account from which such funds shall be paid</label>
                <input type="text" id="source_of_fees_location" wire:model="formData.source_of_fees_location" 
                       class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
                       placeholder="Bank name and location...">
                @error('formData.source_of_fees_location') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
            </div>
        </div>

        <!-- Required Documents -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">Required Documents</h2>
            
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <div>
                    <label for="corporate_registration" class="block text-sm font-medium text-gray-700 mb-2">Corporate Registration Document</label>
                    
                    <!-- Show existing file if available -->
                    @if(!empty($formData['corporate_registration']) && is_string($formData['corporate_registration']))
                        <div class="mb-3 p-3 bg-blue-50 border border-blue-200 rounded-md">
                            <div class="flex items-center justify-between">
                                <div class="flex items-center">
                                    <svg class="w-5 h-5 text-blue-600 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
                                    </svg>
                                    <span class="text-sm text-blue-700">Current file: {{ $formData['corporate_registration'] }}</span>
                                </div>
                                @if($isAdminAccess)
                                    <a href="{{ route('kyc.admin.download.file', ['kycProcess' => $kycProcess->uuid, 'fileType' => 'corporate_registration']) }}" 
                                       target="_blank"
                                       class="inline-flex items-center px-3 py-1 text-xs font-medium text-blue-600 bg-blue-50 rounded-md hover:bg-blue-100 transition-colors duration-200">
                                        <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
                                        </svg>
                                        Open
                                    </a>
                                @endif
                            </div>
                        </div>
                    @endif
                    
                    <div class="file-upload-wrapper">
                        <input type="file" id="corporate_registration" wire:model="corporateRegistrationFile"
                               @if($isReadOnly) disabled @endif
                               accept=".pdf,.doc,.docx,.jpg,.jpeg,.png">
                        <div class="file-upload-button @if($isReadOnly) opacity-50 cursor-not-allowed @endif">
                            <svg class="file-upload-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"></path>
                            </svg>
                            <span>{{ (!empty($formData['corporate_registration']) && is_string($formData['corporate_registration'])) ? 'Change File' : 'Choose File' }}</span>
                        </div>
                    </div>
                    @error('corporateRegistrationFile') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="tax_registration" class="block text-sm font-medium text-gray-700 mb-2">Tax Registration Document</label>
                    
                    <!-- Show existing file if available -->
                    @if(!empty($formData['tax_registration']) && is_string($formData['tax_registration']))
                        <div class="mb-3 p-3 bg-blue-50 border border-blue-200 rounded-md">
                            <div class="flex items-center justify-between">
                                <div class="flex items-center">
                                    <svg class="w-5 h-5 text-blue-600 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
                                    </svg>
                                    <span class="text-sm text-blue-700">Current file: {{ $formData['tax_registration'] }}</span>
                                </div>
                                @if($isAdminAccess)
                                    <a href="{{ route('kyc.admin.download.file', ['kycProcess' => $kycProcess->uuid, 'fileType' => 'tax_registration']) }}" 
                                       target="_blank"
                                       class="inline-flex items-center px-3 py-1 text-xs font-medium text-blue-600 bg-blue-50 rounded-md hover:bg-blue-100 transition-colors duration-200">
                                        <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
                                        </svg>
                                        Open
                                    </a>
                                @endif
                            </div>
                        </div>
                    @endif
                    
                    <div class="file-upload-wrapper">
                        <input type="file" id="tax_registration" wire:model="taxRegistrationFile"
                               @if($isReadOnly) disabled @endif
                               accept=".pdf,.doc,.docx,.jpg,.jpeg,.png">
                        <div class="file-upload-button @if($isReadOnly) opacity-50 cursor-not-allowed @endif">
                            <svg class="file-upload-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"></path>
                            </svg>
                            <span>{{ (!empty($formData['tax_registration']) && is_string($formData['tax_registration'])) ? 'Change File' : 'Choose File' }}</span>
                        </div>
                    </div>
                    @error('taxRegistrationFile') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="ownership_documents" class="block text-sm font-medium text-gray-700 mb-2">Ownership Documents</label>
                    
                    <!-- Show existing files if available -->
                    @if(!empty($formData['ownership_documents']) && is_array($formData['ownership_documents']) && count($formData['ownership_documents']) > 0)
                        <div class="mb-3 p-3 bg-blue-50 border border-blue-200 rounded-md">
                            <div class="text-sm text-blue-700 mb-2">Current files:</div>
                            @foreach($formData['ownership_documents'] as $index => $file)
                                @if(is_string($file))
                                    <div class="flex items-center justify-between text-xs text-blue-600 mb-1">
                                        <div class="flex items-center">
                                            <svg class="h-4 w-4 text-blue-500 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
                                            </svg>
                                            <span>{{ $file }}</span>
                                        </div>
                                        @if($isAdminAccess)
                                            <a href="{{ route('kyc.admin.download.file', ['kycProcess' => $kycProcess->uuid, 'fileType' => 'ownership_documents', 'index' => $index]) }}" 
                                               target="_blank"
                                               class="inline-flex items-center px-3 py-1 text-xs font-medium text-blue-600 bg-blue-50 rounded-md hover:bg-blue-100 transition-colors duration-200">
                                                <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
                                                </svg>
                                                Open
                                            </a>
                                        @endif
                                    </div>
                                @endif
                            @endforeach
                        </div>
                    @endif
                    
                    <div class="file-upload-wrapper">
                        <input type="file" id="ownership_documents" wire:model="ownershipDocumentsFiles" multiple
                               @if($isReadOnly) disabled @endif
                               accept=".pdf,.doc,.docx,.jpg,.jpeg,.png">
                        <div class="file-upload-button @if($isReadOnly) opacity-50 cursor-not-allowed @endif">
                            <svg class="file-upload-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"></path>
                            </svg>
                            <span>{{ (!empty($formData['ownership_documents']) && is_array($formData['ownership_documents']) && count($formData['ownership_documents']) > 0) ? 'Change Files' : 'Choose Files' }}</span>
                        </div>
                    </div>
                    @error('ownershipDocumentsFiles') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
                
                <div>
                    <label for="directors_documents" class="block text-sm font-medium text-gray-700 mb-2">Directors Documents</label>
                    
                    <!-- Show existing files if available -->
                    @if(!empty($formData['directors_documents']) && is_array($formData['directors_documents']) && count($formData['directors_documents']) > 0)
                        <div class="mb-3 p-3 bg-blue-50 border border-blue-200 rounded-md">
                            <div class="text-sm text-blue-700 mb-2">Current files:</div>
                            @foreach($formData['directors_documents'] as $index => $file)
                                @if(is_string($file))
                                    <div class="flex items-center justify-between text-xs text-blue-600 mb-1">
                                        <div class="flex items-center">
                                            <svg class="h-4 w-4 text-blue-500 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
                                            </svg>
                                            <span>{{ $file }}</span>
                                        </div>
                                        @if($isAdminAccess)
                                            <a href="{{ route('kyc.admin.download.file', ['kycProcess' => $kycProcess->uuid, 'fileType' => 'directors_documents', 'index' => $index]) }}" 
                                               target="_blank"
                                               class="inline-flex items-center px-3 py-1 text-xs font-medium text-blue-600 bg-blue-50 rounded-md hover:bg-blue-100 transition-colors duration-200">
                                                <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
                                                </svg>
                                                Open
                                            </a>
                                        @endif
                                    </div>
                                @endif
                            @endforeach
                        </div>
                    @endif
                    
                    <div class="file-upload-wrapper">
                        <input type="file" id="directors_documents" wire:model="directorsDocumentsFiles" multiple
                               @if($isReadOnly) disabled @endif
                               accept=".pdf,.doc,.docx,.jpg,.jpeg,.png">
                        <div class="file-upload-button @if($isReadOnly) opacity-50 cursor-not-allowed @endif">
                            <svg class="file-upload-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"></path>
                            </svg>
                            <span>{{ (!empty($formData['directors_documents']) && is_array($formData['directors_documents']) && count($formData['directors_documents']) > 0) ? 'Change Files' : 'Choose Files' }}</span>
                        </div>
                    </div>
                    @error('directorsDocumentsFiles') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
                </div>
            </div>
        </div>

        <!-- Declaration -->
        <div class="bg-gray-50 p-6 rounded-lg">
            <h2 class="text-xl font-semibold text-gray-900 mb-4">Declaration</h2>
            <p class="text-sm text-gray-600 mb-4">I, <input type="text" wire:model="formData.authorized_person_name" 
                class="inline-block w-64 h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" 
                placeholder="Full Name">, in my capacity as <input type="text" wire:model="formData.authorized_person_capacity" 
                class="inline-block w-64 h-10 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" 
                placeholder="Position/Title">, certify that am duly authorized to complete this form on behalf of the Client and that the information provided is complete, true and accurate.</p>
            
            <div class="mt-4">
                <label for="authorized_person_signature" class="block text-sm font-medium text-gray-700 mb-2">Signature</label>
                <textarea id="authorized_person_signature" wire:model="formData.authorized_person_signature" rows="3"
                          class="w-full h-12 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"
                          placeholder="Please provide your signature or type your name as confirmation..."></textarea>
                @error('formData.authorized_person_signature') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
            </div>
            
            @error('formData.authorized_person_name') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
            @error('formData.authorized_person_capacity') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
        </div>

        <!-- Submit Button -->
        @if(!$isReadOnly)
            <div class="text-center">
                <button type="submit" 
                        class="bg-green-600 text-white px-12 py-4 rounded-lg hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2 text-lg font-semibold shadow-lg transform transition-all duration-200 hover:scale-105">
                    <svg class="inline-block h-6 w-6 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
                    </svg>
                    Submit KYC Form
                </button>
                <p class="text-sm text-gray-500 mt-3">
                    By clicking submit, you confirm that all information provided is accurate and complete.
                </p>
            </div>
        @else
            <div class="text-center">
                <div class="bg-gray-100 text-gray-600 px-8 py-3 rounded-md text-lg font-medium">
                    📋 Form Data - Read Only
                </div>
            </div>
        @endif
    </form>

    <!-- Legal Information -->
    <div class="mt-8 p-6 bg-blue-50 rounded-lg">
        <h3 class="text-lg font-semibold text-blue-900 mb-4">Legal Information</h3>
        <p class="text-sm text-blue-800 mb-4">
            <strong>Note:</strong> The ultimate beneficiary is the entity, owner and/or controller of the entity who will benefit from the services rendered by the Firm, as defined by article 30 of Portuguese law No. 83/2017, of August 10.
        </p>
        <p class="text-sm text-blue-800">
            <strong>Documentation Required:</strong> Please provide copy of document(s) supporting all information stated in this form.
        </p>
    </div>
</div>