@php use Illuminate\Support\Facades\Storage; @endphp
<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <x-breadcrumb :title="'Invitation Letter for Application ID: ' . $appId" :breadcrumb="$breadcrumb" />
        <x-back-button />

    </div>

    <div class="container mt-5">
        <x-validation-errors />

        <div class="card">
            @if (session()->has('success'))
                <div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative mb-4" role="alert">
                    <span class="block sm:inline">{{ session('success') }}</span>
                </div>
            @endif

            @if (session()->has('error'))
                <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative mb-4" role="alert">
                    <span class="block sm:inline">{{ session('error') }}</span>
                </div>
            @endif

            <div class="card-body">
                <!-- Invitation Letter Upload -->
                @if($invitationDocumentData)
                <div class="mb-3">
                    <div class="row">
                        <div class="col-sm-3">
                            <label class="form-label fw-bold">Download Invitation Letter</label>
                        </div>
                        <div class="col-sm-6">
                            <a target="__blank" href="{{  Storage::url($invitationDocumentData['latest_files']['c_file_path']    ) }} }}" 
                                class="btn btn-info btn-sm">
                                <i class="fas fa-download"></i> {{ $invitationDocumentData['latest_files']['c_file_name'] ?? 'View' }}
                            </a>
                        </div>
                    </div>
                </div>
                @endif

                {{-- Agreement Signed Date --}}
                <div class="mb-3">
                    <div class="row">
                        <div class="col-sm-3">
                            <label class="form-label fw-bold">Agreement Signed Date</label>
                        </div>
                        <div class="col-sm-4">
                            {{ $application['d_inv_assign_date'] }}
                        </div>
                    </div>
                </div>

                {{-- Existing Remarks --}}
                <div class="mb-3">
                    <div class="row">
                        <div class="col-sm-3">
                            <label class="form-label fw-bold">Remarks</label>
                        </div>
                        <div class="col-sm-6">
                             {{ $scutiny['remarks'] }}
                        </div>
                    </div>
                </div>

                <hr>

                {{-- Invitation Accepted Radio Buttons --}}
                <div class="mb-3">
                    <div class="row">
                        <div class="col-sm-3">
                            <label class="form-label fw-bold">
                                Invitation accepted? <span class="text-danger">*</span>
                            </label>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-check form-check-inline">
                                <input class="form-check-input" type="radio" 
                                        wire:model.live="acceptYN" 
                                        id="acceptYes" 
                                        value="Y">
                                <label class="form-check-label" for="acceptYes">OK</label>
                            </div>
                            <div class="form-check form-check-inline">
                                <input class="form-check-input" type="radio" 
                                        wire:model.live="acceptYN" 
                                        id="acceptNo" 
                                        value="N">
                                <label class="form-check-label" for="acceptNo">Not OK</label>
                            </div>
                            @error('acceptYN')
                                <div class="text-danger small mt-1">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>

                {{-- Remarks Textarea --}}
                <div class="mb-3">
                    <div class="row">
                        <div class="col-md-3">
                            <label class="form-label fw-bold">Remarks, if any</label>
                        </div>
                        <div class="col-md-6">
                            <textarea wire:model="remarks" 
                                        class="form-control @error('remarks') is-invalid @enderror" 
                                        rows="3"></textarea>
                            @error('remarks')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>

               
                @if($acceptYN === 'N')
                    <div class="mb-3">
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="form-label fw-bold">Invitation Reschedule Upload</label>
                            </div>
                            <div class="col-sm-6">
                                    <livewire:file-upload
                                        :app_id="$appId"
                                        :folder="$folder"
                                        :version="$invitaionRescheduleData['latest_files']['n_ver'] ?? 0"
                                        :document_id="$invitaionRescheduleData['c_document_id']"
                                        :name="$invitaionRescheduleData['c_display_name']"
                                        :short_name="$invitaionRescheduleData['c_short_name']"
                                        :upload_source="$source"
                                        :upload_options='$uploadOptions'
                                        wire:key="uploads-{{ $invitaionRescheduleData['c_document_id'] }}"
                                        :file_name="$invitaionRescheduleData['latest_files']['c_file_name'] ?? ''"
                                        :file_path="$invitaionRescheduleData['latest_files']['c_file_path'] ?? ''"
                                        :signatureDetails="$invitaionRescheduleData['latest_files']['sign_details'] ?? []" 
                                    />
                                    <small class="text-muted d-block mt-2">
                                        Allowed formats: PDF, JPG, PNG (Max 5MB)
                                    </small>
                            </div>
                 `           @error('invitation_reschedule_required') 
                                <div class="text-danger small mt-1">{{ $message }}</div> 
                            @enderror`
                        </div>
                    </div>
                @endif


                <!-- Action Buttons -->
                <div class="d-flex justify-content-center gap-3 mt-4">
                    <button 
                        type="button" 
                        class="btn btn-primary px-4"
                        wire:click="submitApplication"
                        wire:loading.attr="disabled"
                        wire:target="submitApplication"
                    >
                        <span wire:loading.remove wire:target="submitApplication">
                            <i class="fas fa-paper-plane"></i> Final Submit
                        </span>
                        <span wire:loading wire:target="submitApplication">
                            <span class="spinner-border spinner-border-sm" role="status"></span>
                            Processing...
                        </span>
                    </button>
                </div>
            </div>
        </div>
    </div>
    @push('scripts')
    <script>
        document.addEventListener('livewire:init', () => {
            Livewire.on('showConfirmation', (event) => {
                if (confirm(event.message)) {
                    @this.call(event.action);
                }
            });
        });
    </script>
    @endpush
</div>