@extends('layouts.app')

@section('title')
Application Form
@endsection

@section('css')
<link href="{{ asset('build/libs/select2/css/select2.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ URL::asset('build/libs/sweetalert2/sweetalert2.min.css') }}" rel="stylesheet" type="text/css" />
@endsection

@section('content')

@component('components.breadcrumb')
@slot('li_1') Application @endslot
@slot('title') Application Form @endslot
@endcomponent

<style>
    .a4-page {
        min-height: 1123px;
        margin: 0 auto;
        padding: 30px;
        background: white;
    }
    .table-compact th,
    .table-compact td {
        padding: 0.25rem 0.5rem;
    }
    .inline-input {
        display: inline-block;
        width: auto;
    }
    [data-repeater-item] hr {
        display: none;
    }
    [data-repeater-item]:not(:first-child) hr {
        display: block;
    }
    .autofit-textarea {
        overflow: hidden;
        resize: none;
    }
    .was-validated .form-control:invalid,
    .was-validated .form-select:invalid,
    .was-validated textarea:invalid {
        border-color: #dc3545;
        background-color: #fff5f5;
        background-image: none;
    }
    .was-validated .form-control:invalid:focus,
    .was-validated .form-select:invalid:focus,
    .was-validated textarea:invalid:focus {
        box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
    }
    .was-validated .form-control:valid,
    .was-validated .form-select:valid,
    .was-validated textarea:valid {
        border-color: var(--bs-border-color, #ced4da);
        background-image: none;
        box-shadow: none;
    }
    .was-validated .form-check-input:invalid {
        border-color: #dc3545;
        background-color: #fff5f5;
    }
    .was-validated .form-check-input:invalid:focus {
        box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
    }
    .was-validated .form-check-input:valid {
        border-color: var(--bs-border-color, #ced4da);
        background-image: none;
    }
    .was-validated .form-check-input:invalid ~ .form-check-label {
        color: #dc3545;
    }
    .swal2-toast .swal2-title,
    .swal2-toast .swal2-html-container {
        color: #fff !important;
    }
</style>

@php
    use App\Models\Info\Facility;
    use App\Models\LeadApplicant;

    $factoring = $facilities->where('code', Facility::CODE_FACTORING)->first();
    $preFactoring = $facilities->where('code', Facility::CODE_PRE_FACTORING)->first();
    $leadIndividual = optional(optional($lead)->applicant)->applicant_type == LeadApplicant::APPLICANT_INDIVIDUAL;

    $sectionRejections = function ($records) {
        $records = is_iterable($records) ? collect($records) : collect([$records]);
        return $records->filter()->flatMap(function ($r) {
            $out = [];
            if (($r->verify_status_1 ?? null) === 'rejected' && !empty($r->verify_remarks_1)) {
                $out[] = $r->verify_remarks_1;
            }
            if (($r->verify_status_2 ?? null) === 'rejected' && !empty($r->verify_remarks_2)) {
                $out[] = $r->verify_remarks_2;
            }
            return $out;
        });
    };

    $toastSuccess = collect(['success', 'error'])->map(fn ($key) => $key === 'success' ? session('success') : null)->filter()->first();
@endphp

@if (session('error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="mdi mdi-alert-circle-outline me-2"></i> {{ session('error') }}
    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif

@if ($errors->any())
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="mdi mdi-alert-circle-outline me-2"></i> Please fix the errors below.
    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
<ul class="list-group mb-3">
    @foreach ($errors->all() as $error)
    <li class="list-group-item list-group-item-danger">{{ $error }}</li>
    @endforeach
</ul>
@endif

<div id="form" class="row formdiv">
    <div class="col-lg-12">
        <div class="a4-page" id="a4">

            {{-- 1. FACILITY APPLIED & AMOUNT --}}
            <div id="init">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-2">
                    <h5 class="card-title text-center m-0 fs-6 text-white">1. FACILITY APPLIED &amp; AMOUNT</h5>
                </div>
                @php $initRemarks = $sectionRejections($lead); @endphp
                @if ($initRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($initRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'init', 'leadSN' => optional($lead)->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <input type="hidden" name="facility_code" value="{{ Facility::CODE_FACTORING }}">
                    <div class="card border-dark rounded-0 p-2 mb-3">
                        <table class="table table-bordered border-dark text-center table-compact mb-0" style="table-layout: fixed; word-wrap: break-word;">
                            <colgroup>
                                <col style="width: 25%;">
                                <col style="width: 25%;">
                                <col style="width: 25%;">
                                <col style="width: 25%;">
                            </colgroup>
                            <thead>
                                <tr>
                                    <th colspan="2">
                                        Pre-Factoring
                                        <input type="hidden" name="pre_facility_code" value="{{ Facility::CODE_PRE_FACTORING }}">
                                        <input type="hidden" name="pre_checkbox" id="pre_checkbox_state" value="{{ optional($lead)->pre_purpose_code ? '1' : '' }}">
                                    </th>
                                    <th colspan="2">Factoring <span class="text-danger">*</span></th>
                                </tr>
                                <tr>
                                    <th>Type</th>
                                    <th>Amount</th>
                                    <th>Type</th>
                                    <th>Amount</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td class="text-start">
                                        <select name="pre_purpose_code" id="pre_purpose_select" class="form-select form-select-sm">
                                            <option value="">-- None --</option>
                                            @foreach ($facilities_types as $type)
                                            @if ($type->facility_code == $preFactoring->code)
                                            <option value="{{ $type->code }}" {{ optional($lead)->pre_purpose_code == $type->code ? 'selected' : '' }}>{{ $type->description }}</option>
                                            @endif
                                            @endforeach
                                        </select>
                                        @error('pre_purpose_code')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </td>
                                    <td>
                                        <input type="number" name="pre_fund_amount" id="pre_amount_input" class="form-control form-control-sm" value="{{ optional($lead)->pre_fund_amount }}" min="1000" step="0.01" {{ optional($lead)->pre_purpose_code ? 'required' : 'disabled' }}>
                                        @error('pre_fund_amount')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </td>
                                    <td class="text-start">
                                        <select name="purpose_code" id="purpose_select" class="form-select form-select-sm" required>
                                            <option value="" disabled {{ optional($lead)->purpose_code ? '' : 'selected' }}>-- Select --</option>
                                            @foreach ($facilities_types as $type)
                                            @if ($type->facility_code == $factoring->code)
                                            <option value="{{ $type->code }}" {{ optional($lead)->purpose_code == $type->code ? 'selected' : '' }}>{{ $type->description }}</option>
                                            @endif
                                            @endforeach
                                        </select>
                                        @error('purpose_code')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </td>
                                    <td>
                                        <input type="number" name="fund_amount" class="form-control form-control-sm" value="{{ optional($lead)->fund_amount }}" min="1000" step="0.01" required>
                                        @error('fund_amount')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        <div class="col row mt-2">
                            <div class="fw-bold col-auto align-self-center">Duration <span class="text-danger">*</span> :</div>
                            <div class="col-auto">
                                <input type="number" name="tenure_period" id="tenure_period_input" class="form-control form-control-sm" value="{{ optional($lead)->tenure_period }}" min="1" step="1" required>
                                @error('tenure_period')<small class="text-danger d-block">{{ $message }}</small>@enderror
                            </div>
                            <div class="col-auto">
                                <select name="tenure_unit" class="form-select form-select-sm" required>
                                    <option value="">Select Unit</option>
                                    @foreach ($tenure_units as $unit)
                                    <option value="{{ $unit->code }}" {{ optional($lead)->tenure_unit == $unit->code ? 'selected' : '' }}>{{ $unit->description }}</option>
                                    @endforeach
                                </select>
                                @error('tenure_unit')<small class="text-danger d-block">{{ $message }}</small>@enderror
                            </div>
                        </div>
                        <div class="col row mt-2">
                            <div class="fw-bold col-auto align-self-center">Originator <span class="text-danger">*</span> :</div>
                            <div class="col-auto" style="min-width: 240px;">
                                <select class="form-select form-select-sm select2" id="originator" name="originator" required>
                                    <option value="">Select Originator</option>
                                    @foreach ($originators as $originator)
                                    <option value="{{ $originator->id }}" {{ optional($lead)->originator == $originator->id ? 'selected' : '' }}>{{ $originator->name }}</option>
                                    @endforeach
                                </select>
                                @error('originator')<small class="text-danger d-block">{{ $message }}</small>@enderror
                            </div>
                        </div>
                        <div class="col row mt-2">
                            <div class="fw-bold col-auto">Loan Summary <span class="text-danger">*</span> :</div>
                            <div class="col">
                                <textarea name="title_summary" class="form-control form-control-sm autofit-textarea" rows="2" maxlength="65535" required>{{ optional($lead)->title_summary }}</textarea>
                                @error('title_summary')<small class="text-danger d-block">{{ $message }}</small>@enderror
                            </div>
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is required.</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            @if (!$lead)
            <div class="alert alert-info">Please save Section 1 first to unlock the rest of the application form.</div>
            @else

            {{-- 2. PARTICULARS OF APPLICANT --}}
            <div id="applicant">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-2">
                    <h5 class="card-title text-center m-0 fs-6 text-white">2. PARTICULARS OF APPLICANT</h5>
                </div>
                @php $applicantRemarks = $sectionRejections($lead->applicant); @endphp
                @if ($applicantRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($applicantRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'applicant', 'leadSN' => $lead->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <div class="card rounded-0 p-2 mb-3">
                        <div class="row px-2 mb-2">
                            <div class="fw-bold col-2 align-self-center">Business Constitution <span class="text-danger">*</span></div>
                            <div class="col-auto p-0 align-self-center">:</div>
                            <div class="col">
                                <select name="applicant_type" id="applicant_type_select" class="form-select form-select-sm" required>
                                    <option value="">Select Type</option>
                                    @foreach ($vendor_types as $type)
                                    <option value="{{ $type->code }}" {{ optional($lead->applicant)->applicant_type == $type->code ? 'selected' : '' }}>{{ $type->name }}</option>
                                    @endforeach
                                </select>
                                @error('applicant_type')<small class="text-danger d-block">{{ $message }}</small>@enderror
                            </div>
                        </div>

                        {{-- Individual applicant fields (pre-filled from registered profile) --}}
                        <div id="applicant-individual-fields">
                            <div class="row px-2 mb-2">
                                <div class="col-10 offset-2">
                                    <small class="text-muted">Pre-filled from your registered profile. To make changes, please <a href="{{ route('profile.complete') }}">update your profile</a>.</small>
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Name of Applicant <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="text" name="applicant_name" class="form-control form-control-sm" value="{{ auth()->user()->name }}" readonly>
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">NRIC <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="text" name="applicant_nric" class="form-control form-control-sm" value="{{ auth()->user()->national_id }}" readonly>
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2">Address <span class="text-danger">*</span></div>
                                <div class="col-auto p-0">:</div>
                                <div class="col">
                                    <input type="text" class="form-control form-control-sm mb-1" value="{{ auth()->user()->home_address_1 }}" readonly>
                                    <input type="hidden" name="applicant_address_1" value="{{ auth()->user()->home_address_1 }}">
                                    <input type="text" class="form-control form-control-sm mb-1" value="{{ auth()->user()->home_address_2 }}" readonly>
                                    <input type="hidden" name="applicant_address_2" value="{{ auth()->user()->home_address_2 }}">
                                    <div class="row g-1">
                                        <div class="col-4">
                                            <input type="text" class="form-control form-control-sm" value="{{ auth()->user()->home_postcode }}" readonly>
                                            <input type="hidden" name="applicant_postcode" value="{{ auth()->user()->home_postcode }}">
                                        </div>
                                        <div class="col-4">
                                            <input type="text" class="form-control form-control-sm" value="{{ auth()->user()->home_city }}" readonly>
                                            <input type="hidden" name="applicant_city" value="{{ auth()->user()->home_city }}">
                                        </div>
                                        <div class="col-4">
                                            <input type="text" class="form-control form-control-sm" value="{{ optional($states->where('code', auth()->user()->home_state)->first())->name }}" readonly>
                                            <input type="hidden" name="applicant_state" value="{{ auth()->user()->home_state }}">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Telephone No. <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <div class="input-group input-group-sm">
                                        <span class="input-group-text">+60</span>
                                        <input type="text" name="applicant_phone" class="form-control form-control-sm" value="{{ auth()->user()->mobile_phone }}" readonly>
                                    </div>
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Email <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="email" name="applicant_email" class="form-control form-control-sm" value="{{ auth()->user()->email }}" readonly>
                                </div>
                            </div>
                        </div>

                        {{-- Company / business applicant fields --}}
                        <div id="applicant-company-fields">
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Name of Entity <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="text" name="applicant_name" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_name }}" maxlength="255" required>
                                    @error('applicant_name')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Company Registration No <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="text" name="applicant_brn" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_brn }}" maxlength="50" required>
                                    @error('applicant_brn')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Reg. Date <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="date" name="applicant_brd" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_brd }}" required>
                                    @error('applicant_brd')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Principal Activities</div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="text" name="principal_activities" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->principal_activities }}" maxlength="255">
                                    @error('principal_activities')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2">Business Address <span class="text-danger">*</span></div>
                                <div class="col-auto p-0">:</div>
                                <div class="col">
                                    <input type="text" name="applicant_address_1" class="form-control form-control-sm mb-1" placeholder="Address Line 1" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_address_1 }}" maxlength="255" required>
                                    @error('applicant_address_1')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    <input type="text" name="applicant_address_2" class="form-control form-control-sm mb-1" placeholder="Address Line 2" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_address_2 }}" maxlength="255">
                                    <div class="row g-1">
                                        <div class="col-4">
                                            <input type="text" name="applicant_postcode" class="form-control form-control-sm" placeholder="Postcode" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_postcode }}" maxlength="10" required>
                                            @error('applicant_postcode')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                        </div>
                                        <div class="col-4">
                                            <input type="text" name="applicant_city" class="form-control form-control-sm" placeholder="City" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_city }}" maxlength="100" required>
                                            @error('applicant_city')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                        </div>
                                        <div class="col-4">
                                            <select name="applicant_state" class="form-select form-select-sm" required>
                                                <option value="">State</option>
                                                @foreach ($states as $state)
                                                <option value="{{ $state->code }}" {{ (!$leadIndividual && optional($lead->applicant)->applicant_state == $state->code) ? 'selected' : '' }}>{{ $state->name }}</option>
                                                @endforeach
                                            </select>
                                            @error('applicant_state')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Location of Branches (if any)</div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="text" name="applicant_branch_location" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_branch_location }}" maxlength="255">
                                    @error('applicant_branch_location')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Telephone No. <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <div class="input-group input-group-sm">
                                        <span class="input-group-text">+60</span>
                                        <input type="text" name="applicant_phone" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_phone }}" maxlength="15" required>
                                    </div>
                                    @error('applicant_phone')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Email <span class="text-danger">*</span></div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="email" name="applicant_email" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_email }}" maxlength="255" required>
                                    @error('applicant_email')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Facsimile No.</div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="text" name="applicant_fax_no" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_fax_no }}" maxlength="20">
                                    @error('applicant_fax_no')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2">Person/s to Contact <span class="text-danger">*</span></div>
                                <div class="col-auto p-0">:</div>
                                <div class="col">
                                    <input type="text" name="contact_name" class="form-control form-control-sm mb-1" placeholder="Name" value="{{ $leadIndividual ? '' : optional($lead->applicant)->contact_name }}" maxlength="255" required>
                                    @error('contact_name')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    <div class="row g-1">
                                        <div class="col-4">
                                            <input type="text" name="contact_position" class="form-control form-control-sm" placeholder="Position" value="{{ $leadIndividual ? '' : optional($lead->applicant)->contact_position }}" maxlength="255" required>
                                            @error('contact_position')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                        </div>
                                        <div class="col-4">
                                            <input type="text" name="contact_phone" class="form-control form-control-sm" placeholder="Tel" value="{{ $leadIndividual ? '' : optional($lead->applicant)->contact_phone }}" maxlength="15" required>
                                            @error('contact_phone')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                        </div>
                                        <div class="col-4">
                                            <input type="email" name="contact_email" class="form-control form-control-sm" placeholder="Email" value="{{ $leadIndividual ? '' : optional($lead->applicant)->contact_email }}" maxlength="255" required>
                                            @error('contact_email')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Number of Employees</div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="number" name="applicant_employee_no" class="form-control form-control-sm" value="{{ $leadIndividual ? '' : optional($lead->applicant)->applicant_employee_no }}" min="0">
                                    @error('applicant_employee_no')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                        </div>

                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is required.</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            {{-- 3. SHAREHOLDERS / DIRECTORS / PARTNERS / PROPRIETOR --}}
            <div id="shareholder">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-0">
                    <h5 class="card-title text-center m-0 fs-6 text-white">3. SHAREHOLDERS / DIRECTORS / PARTNERS / PROPRIETOR</h5>
                </div>
                @php $shareholderRemarks = $sectionRejections($lead->shareholders); @endphp
                @if ($shareholderRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($shareholderRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="repeater needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'shareholder', 'leadSN' => $lead->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <div class="card border-dark rounded-0 p-2 mb-3">
                        <table class="table table-bordered border-dark text-center table-compact mb-0">
                            <thead id="shareholder-thead">
                                <tr>
                                    <th>Name <span class="text-danger">*</span></th>
                                    <th>Designation <span class="text-danger">*</span></th>
                                    <th>Shareholding (%) <span class="text-danger">*</span></th>
                                    <th style="width: 60px;"></th>
                                </tr>
                            </thead>
                            <tbody data-repeater-list="shareholders">
                                @forelse ($lead->shareholders as $shareholder)
                                <tr data-repeater-item>
                                    <input type="hidden" name="serial_no" value="{{ $shareholder->serial_no }}">
                                    <td>
                                        <input type="text" name="name" class="form-control form-control-sm" value="{{ $shareholder->name }}" maxlength="255" required>
                                        @error('shareholders.*.name')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </td>
                                    <td><input type="text" name="designation" class="form-control form-control-sm" value="{{ $shareholder->designation }}" maxlength="100" required></td>
                                    <td><input type="number" name="shareholding_percent" class="form-control form-control-sm" value="{{ $shareholder->shareholding_percent }}" min="0" max="100" step="0.01" required></td>
                                    <td><button data-repeater-delete type="button" class="btn btn-sm btn-outline-danger">&times;</button></td>
                                </tr>
                                @empty
                                <tr data-repeater-item data-placeholder-row="1">
                                    <input type="hidden" name="serial_no" value="">
                                    <td>
                                        <input type="text" name="name" class="form-control form-control-sm" maxlength="255" required>
                                        @error('shareholders.*.name')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </td>
                                    <td><input type="text" name="designation" class="form-control form-control-sm" maxlength="100" required></td>
                                    <td><input type="number" name="shareholding_percent" class="form-control form-control-sm" min="0" max="100" step="0.01" required></td>
                                    <td><button data-repeater-delete type="button" class="btn btn-sm btn-outline-danger">&times;</button></td>
                                </tr>
                                @endforelse
                            </tbody>
                        </table>
                        <div class="mt-2">
                            <input data-repeater-create type="button" class="btn btn-success btn-sm" value="Add Row">
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is not required</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            {{-- 4. BANK ACCOUNT INFORMATION --}}
            <div id="bank">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-0">
                    <h5 class="card-title text-center m-0 fs-6 text-white">4. BANK ACCOUNT INFORMATION</h5>
                </div>
                @php $bankRemarks = $sectionRejections($lead->banks); @endphp
                @if ($bankRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($bankRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="repeater needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'bank', 'leadSN' => $lead->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <div class="card border-dark rounded-0 p-2 mb-3">
                        <table class="table table-bordered border-dark text-center table-compact mb-0">
                            <thead id="bank-thead">
                                <tr>
                                    <th>Bank <span class="text-danger">*</span></th>
                                    <th>Account Number <span class="text-danger">*</span></th>
                                    <th>Facility</th>
                                    <th>Limit (RM)</th>
                                    <th style="width: 60px;"></th>
                                </tr>
                            </thead>
                            <tbody data-repeater-list="banks">
                                @php $banksLoop = $lead->banks->count() ? $lead->banks : [null]; @endphp
                                @foreach ($banksLoop as $bank)
                                <tr data-repeater-item {{ $bank === null ? 'data-placeholder-row="1"' : '' }}>
                                    <input type="hidden" name="serial_no" value="{{ $bank->serial_no ?? '' }}">
                                    <td>
                                        <select name="bank_code" class="form-select form-select-sm" required>
                                            <option value="">Select Bank</option>
                                            @foreach ($banks as $b)
                                            <option value="{{ $b->bank_code }}" {{ optional($bank)->bank_code == $b->bank_code ? 'selected' : '' }}>{{ $b->bank_name }}</option>
                                            @endforeach
                                        </select>
                                        @error('banks.*.bank_code')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </td>
                                    <td>
                                        <input type="text" name="acc_no" class="form-control form-control-sm digits-only" value="{{ optional($bank)->acc_no }}" maxlength="25" required>
                                        @error('banks.*.acc_no')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </td>
                                    <td><input type="text" name="facility" class="form-control form-control-sm" value="{{ optional($bank)->facility }}" maxlength="255"></td>
                                    <td><input type="number" name="limit_amount" class="form-control form-control-sm" value="{{ optional($bank)->limit_amount }}" min="1000" step="0.01"></td>
                                    <td><button data-repeater-delete type="button" class="btn btn-sm btn-outline-danger">&times;</button></td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                        <div class="mt-2">
                            <input data-repeater-create type="button" class="btn btn-success btn-sm" value="Add Row">
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is required to have at least 1 record.</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            {{-- 5. FINANCIAL INSTITUTIONS / BANKS --}}
            <div id="financial_institution">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-2">
                    <h5 class="card-title text-center m-0 fs-6 text-white">5. FINANCIAL INSTITUTIONS / BANKS</h5>
                </div>
                @php $financialInstitutionRemarks = $sectionRejections($lead->financialInstitution); @endphp
                @if ($financialInstitutionRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($financialInstitutionRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'financial_institution', 'leadSN' => $lead->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <div class="card rounded-0 p-2 mb-3">
                        <div class="row px-2 mb-2">
                            <div class="fw-bold">Relation with other Banks / Finance Companies / Factoring Companies / Others</div>
                        </div>
                        <div class="row px-2 mb-2">
                            <div class="fw-bold col-2 align-self-center">Name</div>
                            <div class="col-auto p-0 align-self-center">:</div>
                            <div class="col"><input type="text" name="name" class="form-control form-control-sm" value="{{ optional($lead->financialInstitution)->name }}" maxlength="255"></div>
                        </div>
                        <div class="row px-2 mb-2">
                            <div class="fw-bold col-2 align-self-center">Location</div>
                            <div class="col-auto p-0 align-self-center">:</div>
                            <div class="col"><input type="text" name="location" class="form-control form-control-sm" value="{{ optional($lead->financialInstitution)->location }}" maxlength="255"></div>
                        </div>
                        <div class="row px-2 mb-2">
                            <div class="fw-bold col-2 align-self-center">Type of Facility</div>
                            <div class="col-auto p-0 align-self-center">:</div>
                            <div class="col"><input type="text" name="facility_type" class="form-control form-control-sm" value="{{ optional($lead->financialInstitution)->facility_type }}" maxlength="255"></div>
                        </div>
                        <div class="row px-2 mb-2">
                            <div class="fw-bold col-2 align-self-center">Limit (RM)</div>
                            <div class="col-auto p-0 align-self-center">:</div>
                            <div class="col"><input type="number" name="limit_amount" class="form-control form-control-sm" value="{{ optional($lead->financialInstitution)->limit_amount }}" min="0" step="0.01"></div>
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is not required</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            {{-- 6. CUSTOMERS (CONTRACT AWARDER) --}}
            <div id="contract">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-2">
                    <h5 class="card-title text-center m-0 fs-6 text-white">6. CUSTOMERS (CONTRACT AWARDER)</h5>
                </div>
                @php $contractRemarks = $sectionRejections($lead->contracts); @endphp
                @if ($contractRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($contractRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="repeater needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'contract', 'leadSN' => $lead->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <div class="card rounded-0 p-2 mb-3">
                        <div class="row px-2 mb-2">
                            <div class="fw-bold">Customers for references :</div>
                        </div>
                        @php $contractsLoop = $lead->contracts->count() ? $lead->contracts : [null]; @endphp
                        <div data-repeater-list="contracts">
                            @foreach ($contractsLoop as $contract)
                            <div data-repeater-item {{ $contract === null ? 'data-placeholder-row="1"' : '' }}>
                                <hr class="my-2">
                                <input type="hidden" name="serial_no" value="{{ $contract->serial_no ?? '' }}">
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2">Customer <span class="item-number">{{ $loop->iteration }}</span></div>
                                    <div class="col-auto ms-auto"><button data-repeater-delete type="button" class="btn btn-sm btn-outline-danger">&times;</button></div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Company <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="awarder_name" class="form-control form-control-sm" value="{{ optional($contract)->awarder_name }}" maxlength="255" required>
                                        @error('contracts.*.awarder_name')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Awarder Type <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <select name="awarder_type" class="form-select form-select-sm" required>
                                            <option value="">Select Type</option>
                                            @foreach ($awarder_types as $type)
                                            <option value="{{ $type->code }}" {{ optional($contract)->awarder_type == $type->code ? 'selected' : '' }}>{{ $type->description }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2">Contract Summary <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0">:</div>
                                    <div class="col">
                                        <textarea name="contract_title" class="form-control form-control-sm autofit-textarea" rows="2" maxlength="65535" required>{{ optional($contract)->contract_title }}</textarea>
                                        @error('contracts.*.contract_title')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Telephone No. <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="contact_phone" class="form-control form-control-sm" value="{{ optional($contract)->contact_phone }}" maxlength="20" required>
                                        @error('contracts.*.contact_phone')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Contact Person <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="contact_person" class="form-control form-control-sm" value="{{ optional($contract)->contact_person }}" maxlength="255" required>
                                        @error('contracts.*.contact_person')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Email <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="email" name="contact_email" class="form-control form-control-sm" value="{{ optional($contract)->contact_email }}" maxlength="255" required>
                                        @error('contracts.*.contact_email')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Contract Amount (RM) <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="number" name="contract_value" class="form-control form-control-sm" value="{{ optional($contract)->contract_value }}" min="0" step="0.01" required>
                                        @error('contracts.*.contract_value')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Tenure (month(s)) <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="number" name="tenure_period" class="form-control form-control-sm" value="{{ optional($contract)->tenure_period }}" min="1" step="1" required>
                                        @error('contracts.*.tenure_period')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Source of Payment <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <select name="payment_method" class="form-select form-select-sm" required>
                                            <option value="">Select Method</option>
                                            @foreach ($payment_methods as $method)
                                            <option value="{{ $method->code }}" {{ optional($contract)->payment_method == $method->code ? 'selected' : '' }}>{{ $method->description }}</option>
                                            @endforeach
                                        </select>
                                        @error('contracts.*.payment_method')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Assignment Of Payment <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <select name="assignment_of_payment" class="form-select form-select-sm" required>
                                            <option value="">-- Select --</option>
                                            <option value="yes" {{ optional($contract)->assignment_of_payment == 'yes' ? 'selected' : '' }}>Yes</option>
                                            <option value="no" {{ optional($contract)->assignment_of_payment == 'no' ? 'selected' : '' }}>No</option>
                                        </select>
                                        @error('contracts.*.assignment_of_payment')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                            </div>
                            @endforeach
                        </div>
                        <div class="mt-2">
                            <input data-repeater-create type="button" class="btn btn-success btn-sm" value="Add Contract">
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is required to have at least 1 record.</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            {{-- 6. SUPPLIERS --}}
            <div id="payee">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-2">
                    <h5 class="card-title text-center m-0 fs-6 text-white">7. SUPPLIERS</h5>
                </div>
                @php $payeeRemarks = $sectionRejections($lead->payees); @endphp
                @if ($payeeRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($payeeRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="repeater needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'payee', 'leadSN' => $lead->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <div class="card rounded-0 p-2 mb-3">
                        <div data-repeater-list="payees">
                            @forelse ($lead->payees as $payee)
                            <div data-repeater-item>
                                <hr class="my-2">
                                <input type="hidden" name="serial_no" value="{{ $payee->serial_no }}">
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2">Supplier <span class="item-number">{{ $loop->iteration }}</span></div>
                                    <div class="col-auto ms-auto"><button data-repeater-delete type="button" class="btn btn-sm btn-outline-danger">&times;</button></div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Company <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="company" class="form-control form-control-sm" value="{{ $payee->company }}" maxlength="255" required>
                                        @error('payees.*.company')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Telephone No. <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="contact_phone" class="form-control form-control-sm" value="{{ $payee->contact_phone }}" maxlength="20" required>
                                        @error('payees.*.contact_phone')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Contact Person <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="contact_person" class="form-control form-control-sm" value="{{ $payee->contact_person }}" maxlength="255" required>
                                        @error('payees.*.contact_person')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Email <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="email" name="contact_email" class="form-control form-control-sm" value="{{ $payee->contact_email }}" maxlength="255" required>
                                        @error('payees.*.contact_email')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                            </div>
                            @empty
                            <div data-repeater-item data-placeholder-row="1">
                                <input type="hidden" name="serial_no" value="">
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2">Supplier <span class="item-number">1</span></div>
                                    <div class="col-auto ms-auto"><button data-repeater-delete type="button" class="btn btn-sm btn-outline-danger">&times;</button></div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Company <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="company" class="form-control form-control-sm" maxlength="255" required>
                                        @error('payees.*.company')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Telephone No. <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="contact_phone" class="form-control form-control-sm" maxlength="20" required>
                                        @error('payees.*.contact_phone')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Contact Person <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="text" name="contact_person" class="form-control form-control-sm" maxlength="255" required>
                                        @error('payees.*.contact_person')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                                <div class="row px-2 mb-2">
                                    <div class="fw-bold col-2 align-self-center">Email <span class="text-danger">*</span></div>
                                    <div class="col-auto p-0 align-self-center">:</div>
                                    <div class="col">
                                        <input type="email" name="contact_email" class="form-control form-control-sm" maxlength="255" required>
                                        @error('payees.*.contact_email')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                    </div>
                                </div>
                            </div>
                            @endforelse
                        </div>
                        <div class="mt-2">
                            <input data-repeater-create type="button" class="btn btn-success btn-sm" value="Add Supplier">
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is not required</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            {{-- 7. DECLARATION --}}
            <div id="declaration">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-0">
                    <h5 class="card-title text-center m-0 fs-6 text-white">8. DECLARATION</h5>
                </div>
                @php $declarationRemarks = $sectionRejections($lead->declaration); @endphp
                @if ($declarationRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($declarationRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'declaration', 'leadSN' => $lead->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <div class="card border-1 border-dark rounded-0 p-3 mb-3">
                        <div class="row px-2 mb-3">
                            <div class="col-9">
                                Has the firm/company, or any of its proprietor/partners/directors or shareholders ever filed for bankruptcy or been served with a winding up/bankruptcy petition? <span class="text-danger">*</span>
                            </div>
                            <div class="col-3 d-flex align-items-center">
                                <input type="radio" name="bankruptcy_status" value="yes" style="accent-color: #222;" {{ optional($lead->declaration)->bankruptcy_status == 'yes' ? 'checked' : '' }} required>
                                <span class="ms-1 me-3">YES</span>
                                <input type="radio" name="bankruptcy_status" value="no" style="accent-color: #222;" {{ optional($lead->declaration)->bankruptcy_status == 'no' ? 'checked' : '' }} required>
                                <span class="ms-1">NO</span>
                                @error('bankruptcy_status')<small class="text-danger d-block w-100">{{ $message }}</small>@enderror
                            </div>
                        </div>
                        <div class="row px-2 mb-3">
                            <div class="col-9">
                                Is there any pending litigation, legal and/or administrative proceeding against the firm/company or its proprietor/partners/directors and shareholders? <span class="text-danger">*</span>
                            </div>
                            <div class="col-3 d-flex align-items-center">
                                <input type="radio" name="litigation_status" value="yes" style="accent-color: #222;" {{ optional($lead->declaration)->litigation_status == 'yes' ? 'checked' : '' }} required>
                                <span class="ms-1 me-3">YES</span>
                                <input type="radio" name="litigation_status" value="no" style="accent-color: #222;" {{ optional($lead->declaration)->litigation_status == 'no' ? 'checked' : '' }} required>
                                <span class="ms-1">NO</span>
                                @error('litigation_status')<small class="text-danger d-block w-100">{{ $message }}</small>@enderror
                            </div>
                        </div>
                        <div class="row px-2 mb-3">
                            <div class="col-9">
                                Are there any judgements pending by or against the firm/company, proprietor/partners/directors and shareholders? <span class="text-danger">*</span>
                            </div>
                            <div class="col-3 d-flex align-items-center">
                                <input type="radio" name="judgement_status" value="yes" style="accent-color: #222;" {{ optional($lead->declaration)->judgement_status == 'yes' ? 'checked' : '' }} required>
                                <span class="ms-1 me-3">YES</span>
                                <input type="radio" name="judgement_status" value="no" style="accent-color: #222;" {{ optional($lead->declaration)->judgement_status == 'no' ? 'checked' : '' }} required>
                                <span class="ms-1">NO</span>
                                @error('judgement_status')<small class="text-danger d-block w-100">{{ $message }}</small>@enderror
                            </div>
                        </div>
                        <div class="row px-2">
                            <div class="fw-bold col-auto">Remarks :</div>
                            <div class="col">
                                <textarea name="remarks" class="form-control form-control-sm autofit-textarea" rows="2" maxlength="1000">{{ optional($lead->declaration)->remarks }}</textarea>
                            </div>
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is required.</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            {{-- 8. CERTIFICATION --}}
            <div id="certification">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-0">
                    <h5 class="card-title text-center m-0 fs-6 text-white">9. CERTIFICATION</h5>
                </div>
                @php $certificationRemarks = $sectionRejections($lead->certification); @endphp
                @if ($certificationRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($certificationRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <form autocomplete="off" class="needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'certification', 'leadSN' => $lead->serial_no]) }}">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <div class="card border-1 border-dark rounded-0 p-3 mb-3">
                        <div class="form-check mb-3">
                            <input type="checkbox" name="cert_accuracy" id="cert_accuracy" class="form-check-input" value="1" {{ optional($lead->certification)->cert_accuracy ? 'checked' : '' }} required>
                            <label class="form-check-label" for="cert_accuracy">
                                I / We represent and warrant that the information provided by me / us is to the best of my / our knowledge, correct, true and that there are no undisclosed liabilities (present or contigent) or information which might influence your decision. I / We hereby agree and consent that you or whomever you shall appoint may obtain and / or check on any information relevant to this application. <span class="text-danger">*</span>
                            </label>
                            @error('cert_accuracy')<small class="text-danger d-block">{{ $message }}</small>@enderror
                        </div>
                        <div class="form-check mb-3">
                            <input type="checkbox" name="cert_disclosure" id="cert_disclosure" class="form-check-input" value="1" {{ optional($lead->certification)->cert_disclosure ? 'checked' : '' }} required>
                            <label class="form-check-label" for="cert_disclosure">
                                I / We hereby authorised us to impart or disclose in confidence any information regarding my / our financial standing to any financial institution or any other parties for any reason we may deem fit. <span class="text-danger">*</span>
                            </label>
                            @error('cert_disclosure')<small class="text-danger d-block">{{ $message }}</small>@enderror
                        </div>
                        <div class="form-check mb-3">
                            <input type="checkbox" name="cert_decline" id="cert_decline" class="form-check-input" value="1" {{ optional($lead->certification)->cert_decline ? 'checked' : '' }} required>
                            <label class="form-check-label" for="cert_decline">
                                I / We understand that we reserve the right at our sole absolute discretion to decline this application and without providing the reason/s for it. <span class="text-danger">*</span>
                            </label>
                            @error('cert_decline')<small class="text-danger d-block">{{ $message }}</small>@enderror
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is required.</small>
                            <button type="submit" class="btn btn-primary btn-sm">Save</button>
                        </div>
                    </div>
                </form>
            </div>

            {{-- DOCUMENT CHECKLIST --}}
            <div id="document">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-0">
                    <h5 class="card-title text-center m-0 fs-6 text-white">DOCUMENT CHECKLIST</h5>
                </div>
                @php
                    $documentRemarks = collect();
                    foreach ($lead->docs as $docR) {
                        if ($docR->verify_status_1 === 'rejected' && !empty($docR->verify_remarks_1)) {
                            $documentRemarks->push(optional($docR->docType)->description . ' - ' . $docR->verify_remarks_1);
                        }
                        if ($docR->verify_status_2 === 'rejected' && !empty($docR->verify_remarks_2)) {
                            $documentRemarks->push(optional($docR->docType)->description . ' - ' . $docR->verify_remarks_2);
                        }
                    }
                @endphp
                @if ($documentRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($documentRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <div class="card border-1 border-end-0 border-bottom-0 border-dark rounded-0 px-1 mb-3">
                    <div class="">
                        <div class="col row px-2">
                            <div class="fw-bold col border border-1 border-dark border-top-0 border-start-0 py-1">Document</div>
                            <div class="fw-bold col-1 border border-1 border-dark border-top-0 border-start-0 py-1">Required</div>
                            <div class="fw-bold col-3 border border-1 border-dark border-top-0 border-start-0 py-1">Uploaded File</div>
                            <div class="fw-bold col-3 border border-1 border-dark border-top-0 border-start-0 py-1">Action</div>
                        </div>
                        @foreach ($docTypes as $categoryId => $docsGroup)
                            @continue((string) $categoryId === (string) $consentsCategoryId)
                            @foreach ($docsGroup as $doc)
                                @php
                                    $hasDoc = isset($uploadedDocs[$doc->code]) && $uploadedDocs[$doc->code]->files->count();
                                @endphp
                                <form autocomplete="off" class="needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'document', 'leadSN' => $lead->serial_no]) }}" enctype="multipart/form-data">
                                    @csrf
                                    <input type="hidden" name="form_target" value="full">
                                    <input type="hidden" name="doc_codes[]" value="{{ $doc->code }}">
                                    <div class="col row px-2">
                                        <div class="col border border-1 border-dark border-top-0 border-start-0 py-1">
                                            {{ $doc->description }}
                                        </div>
                                        <div class="col-1 border border-1 border-dark border-top-0 border-start-0 py-1">
                                            {{ $doc->required ? 'Yes' : 'No' }}
                                        </div>
                                        <div class="col-3 border border-1 border-dark border-top-0 border-start-0 py-1">
                                            @if ($hasDoc)
                                                @foreach ($uploadedDocs[$doc->code]->files as $file)
                                                <div>
                                                    <a href="{{ Storage::disk('supportingdoc')->url($file->file_path) }}" target="_blank">{{ Str::limit($file->file_name, 15) }}</a>
                                                    <input type="hidden" name="existing_files[]" value="{{ $file->serial_no }}">
                                                </div>
                                                @endforeach
                                            @else
                                                -
                                            @endif
                                        </div>
                                        <div class="col-3 border border-1 border-dark border-top-0 border-start-0 py-1">
                                            <div class="d-flex gap-1">
                                                <input type="file" class="form-control form-control-sm" name="docs[{{ $doc->code }}][]" accept="image/*,.pdf,.doc,.docx" {{ ($doc->required && !$hasDoc) ? 'required' : '' }}>
                                                <button type="submit" class="btn btn-primary btn-sm">Upload</button>
                                            </div>
                                            @error("docs.{$doc->code}.*")<small class="text-danger d-block">{{ $message }}</small>@enderror
                                        </div>
                                    </div>
                                </form>
                            @endforeach
                        @endforeach
                    </div>
                </div>

                {{-- CONSENTS --}}
                    @foreach (($docTypes[$consentsCategoryId] ?? collect())->sortBy('code') as $doc)
                        @continue(!$doc->is_active)
                        @php
                            $consentDoc = $uploadedDocs[$doc->code] ?? null;
                            $hasConsentDoc = $consentDoc && $consentDoc->files->count();
                        @endphp
                        <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-0 mt-3">
                            <h5 class="card-title text-center m-0 fs-6 text-white">{{ $doc->description }}</h5>
                        </div>
                        <div class="card border-1 border-dark rounded-0 p-3 mb-3">
                            @if($doc->notes)
                            <p class="mb-2" style="font-size: 0.85rem;">
                                {{ $doc->notes }}
                            </p>
                            @endif
                            @if($doc->template_path)
                            <a href="{{ route('document.template', encrypt($doc->id)) }}" class="btn btn-outline-dark btn-sm mb-3">
                                <i class="mdi mdi-download"></i> Download Template
                            </a>
                            @endif
                            <form autocomplete="off" class="needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'document', 'leadSN' => $lead->serial_no]) }}" enctype="multipart/form-data">
                                @csrf
                                <input type="hidden" name="form_target" value="full">
                                <input type="hidden" name="doc_codes[]" value="{{ $doc->code }}">
                                @if ($hasConsentDoc)
                                <div class="mb-2">
                                    @foreach ($consentDoc->files as $file)
                                    <div>
                                        Uploaded file:
                                        <a href="{{ Storage::disk('supportingdoc')->url($file->file_path) }}" target="_blank">{{ $file->file_name }}</a>
                                        <input type="hidden" name="existing_files[]" value="{{ $file->serial_no }}">
                                    </div>
                                    @endforeach
                                </div>
                                @endif
                                <div class="d-flex gap-1" style="max-width: 400px;">
                                    <input type="file" class="form-control form-control-sm" name="docs[{{ $doc->code }}][]" accept="image/*,.pdf,.doc,.docx" {{ ($doc->required && !$hasConsentDoc) ? 'required' : '' }}>
                                    <button type="submit" class="btn btn-primary btn-sm">Upload</button>
                                </div>
                                @error("docs.{$doc->code}.*")<small class="text-danger d-block">{{ $message }}</small>@enderror
                            </form>
                            @if($doc->required)
                            <small class="text-muted d-block mt-2" style="font-size: 0.75rem;">This section is required.</small>
                            @else
                            <small class="text-muted d-block mt-2" style="font-size: 0.75rem;">This section is optional.</small>
                            @endif
                        </div>
                    @endforeach

                    <div class="card border-0 border-end-0 border-bottom-0 border-dark rounded-0 px-1 mb-3">
                        <div class="d-flex justify-content-between align-items-center my-2">
                            <small class="text-muted" style="font-size: 0.75rem;">Each document is uploaded independently — click "Upload" on the row you want to save.</small>
                        </div>
                    </div>
            </div>

            {{-- APPLICATION FEE --}}
            <div id="fee">
                <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-0">
                    <h5 class="card-title text-center m-0 fs-6 text-white">APPLICATION FEE</h5>
                </div>
                @php
                    $paymentRemarks = collect();
                    foreach ($lead->payments->where('type', 'P1002') as $paymentR) {
                        if ($paymentR->verify_status_1 === 'rejected' && !empty($paymentR->verify_remarks_1)) {
                            $paymentRemarks->push($paymentR->verify_remarks_1);
                        }
                        if ($paymentR->verify_status_2 === 'rejected' && !empty($paymentR->verify_remarks_2)) {
                            $paymentRemarks->push($paymentR->verify_remarks_2);
                        }
                    }
                    $feePayment = $lead->payments->first(fn ($p) => $p->type === 'P1002');
                    $isManualWithFile = $feePayment && $feePayment->method === 'manual' && $feePayment->file_path;
                    $isFpxPaid = $feePayment && $feePayment->method === 'FPX' && $feePayment->status === 'paid';
                    $successTrx = $isFpxPaid
                        ? \App\Models\Transaction::where('serial_no', $lead->serial_no)
                            ->where('transaction_type', 'AF')
                            ->latest('created_at')
                            ->first()
                        : null;
                @endphp
                @if ($paymentRemarks->isNotEmpty())
                <div class="alert alert-danger alert-dismissible fade show mb-0 py-2" role="alert" style="font-size: 0.8rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i><strong>Rejected Reason(s):</strong>
                    <ul class="mb-0 mt-1 ps-3">
                        @foreach ($paymentRemarks as $remark)
                        <li>{{ $remark }}</li>
                        @endforeach
                    </ul>
                    <button type="button" class="btn-close" data-bs-dismiss="alert" style="padding: 0.6rem; font-size: 0.65rem;"></button>
                </div>
                @endif
                <div class="card border-1 border-dark rounded-0 p-3 mb-3">
                    @if ($isFpxPaid)
                    <div class="alert alert-success">
                        <i class="mdi mdi-check-circle-outline me-2"></i>
                        Payment has been made through FPX.
                        @if ($successTrx)
                        <a href="{{ route('payment.receipt', encrypt($successTrx->trx_ref)) }}" target="_blank">View Receipt</a>
                        @endif
                    </div>
                    @elseif ($isManualWithFile)
                    <div class="alert alert-success">
                        <i class="mdi mdi-check-circle-outline me-2"></i>
                        Payment receipt has been uploaded.
                        <a href="{{ Storage::disk('supportingdoc')->url($feePayment->file_path) }}" target="_blank">{{ $feePayment->file_name }}</a>
                    </div>
                    @endif
                    <form autocomplete="off" class="needs-validation" novalidate method="POST" action="{{ route('application.save', ['section' => 'fee', 'leadSN' => $lead->serial_no]) }}" enctype="multipart/form-data">
                        @csrf
                        <input type="hidden" name="form_target" value="full">
                        <div class="row px-2 mb-2">
                            <div class="fw-bold col-2 align-self-center">Fee Amount (RM)</div>
                            <div class="col-auto p-0 align-self-center">:</div>
                            <div class="col"><input type="text" class="form-control form-control-sm bg-light" name="amount" value="{{ number_format($feeAmount, 2) }}" readonly></div>
                        </div>
                        <div class="row px-2 mb-2">
                            <div class="fw-bold col-2 align-self-center">Payment Method <span class="text-danger">*</span></div>
                            <div class="col-auto p-0 align-self-center">:</div>
                            <div class="col">
                                <select name="payment_method" id="fee_payment_method" class="form-select form-select-sm" {{ $isFpxPaid ? 'disabled' : 'required' }}>
                                    <option value="">-- Select --</option>
                                    <option value="manual" {{ optional($feePayment)->method === 'manual' ? 'selected' : '' }}>Upload Payment Receipt</option>
                                    <option value="FPX" {{ optional($feePayment)->method === 'FPX' ? 'selected' : '' }}>Online FPX</option>
                                </select>
                                @error('payment_method')<small class="text-danger d-block">{{ $message }}</small>@enderror
                            </div>
                        </div>
                        <div id="fee-manual-section" class="{{ optional($feePayment)->method === 'manual' ? '' : 'd-none' }}">
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Payment Receipt @unless ($isManualWithFile) <span class="text-danger">*</span> @endunless</div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col">
                                    <input type="file" class="form-control form-control-sm" name="payment_docs" id="fee_payment_docs" accept="image/*,.pdf" {{ $isManualWithFile ? '' : (optional($feePayment)->method === 'manual' ? 'required' : '') }}>
                                    @error('payment_docs')<small class="text-danger d-block">{{ $message }}</small>@enderror
                                </div>
                            </div>
                            <div class="row px-2 mb-2">
                                <div class="fw-bold col-2 align-self-center">Notes</div>
                                <div class="col-auto p-0 align-self-center">:</div>
                                <div class="col"><textarea class="form-control form-control-sm autofit-textarea" name="payment_notes" rows="2" maxlength="500">{{ optional($feePayment)->remarks === 'Application Fee' ? '' : optional($feePayment)->remarks }}</textarea></div>
                            </div>
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-2">
                            <small class="text-muted" style="font-size: 0.75rem;">This section is required.</small>
                            <button type="submit" class="btn btn-primary btn-sm" {{ $isFpxPaid ? 'disabled' : '' }}>Proceed</button>
                        </div>
                    </form>
                </div>
            </div>

            <div class="text-end mb-3">
                @if ($hasRejection)
                <div class="alert alert-danger d-inline-block text-start mb-2 py-2 px-3" role="alert" style="font-size: 0.85rem;">
                    <i class="mdi mdi-alert-circle-outline me-1"></i>
                    One or more sections have been <strong>rejected</strong>. Please resolve all rejections before submitting.
                </div>
                <br>
                <button type="button" class="btn btn-success" disabled>
                    <i class="mdi mdi-file-document-outline me-1"></i>
                    Submit Application
                </button>
                @else
                <form method="POST" action="{{ route('application.save', ['section' => 'submit_application', 'leadSN' => $lead->serial_no]) }}" class="d-inline">
                    @csrf
                    <input type="hidden" name="form_target" value="full">
                    <button type="submit" class="btn btn-success">
                        <i class="mdi mdi-file-document-outline me-1"></i>
                        Submit Application
                    </button>
                </form>
                @endif
            </div>

            @endif
        </div>
    </div>
</div>

@endsection

@section('script')

<script src="{{ asset('build/libs/select2/js/select2.min.js') }}"></script>
<script src="{{ asset('build/js/pages/form-advanced.init.js') }}"></script>

<!-- form repeater js -->
<script src="{{ URL::asset('build/libs/jquery.repeater/jquery.repeater.min.js') }}"></script>
<script src="{{ URL::asset('build/js/pages/form-repeater.int.js') }}"></script>
<script>
    $(function () {
        document.querySelectorAll('[data-placeholder-row]').forEach(function (row) {
            row.remove();
        });
    });
</script>
<script src="{{ URL::asset('build/libs/sweetalert2/sweetalert2.min.js') }}"></script>

<script>
    document.addEventListener('DOMContentLoaded', function () {
        @if ($toastSuccess)
        Swal.fire({
            toast: true,
            position: 'top-right',
            icon: 'success',
            title: @json($toastSuccess),
            showConfirmButton: false,
            timer: 3000,
            timerProgressBar: false,
            background: '#28a745',
            color: '#fff',
            iconColor: '#fff',
        });
        @endif

        const applicantTypeSelect = document.getElementById('applicant_type_select');
        const applicantIndividualFields = document.getElementById('applicant-individual-fields');
        const applicantCompanyFields = document.getElementById('applicant-company-fields');

        function updateApplicantForm(value) {
            if (!applicantIndividualFields || !applicantCompanyFields) return;
            const isIndividual = value === "{{ LeadApplicant::APPLICANT_INDIVIDUAL }}";
            applicantIndividualFields.classList.toggle('d-none', !isIndividual);
            applicantCompanyFields.classList.toggle('d-none', isIndividual);
            applicantIndividualFields.querySelectorAll('input, select, textarea').forEach(function (field) {
                field.disabled = !isIndividual;
            });
            applicantCompanyFields.querySelectorAll('input, select, textarea').forEach(function (field) {
                field.disabled = isIndividual;
            });
        }

        if (applicantTypeSelect) {
            updateApplicantForm(applicantTypeSelect.value);
            applicantTypeSelect.addEventListener('change', function () {
                updateApplicantForm(this.value);
            });
        }

        const prePurposeSelect = document.getElementById('pre_purpose_select');
        const preAmountInput = document.getElementById('pre_amount_input');
        const preCheckboxState = document.getElementById('pre_checkbox_state');

        if (prePurposeSelect) {
            prePurposeSelect.addEventListener('change', function () {
                preAmountInput.value = '';
                if (this.value === '') {
                    preAmountInput.disabled = true;
                    preAmountInput.required = false;
                    if (preCheckboxState) preCheckboxState.value = '';
                } else {
                    preAmountInput.disabled = false;
                    preAmountInput.required = true;
                    if (preCheckboxState) preCheckboxState.value = '1';
                }
            });
        }

        const tenurePeriodInput = document.getElementById('tenure_period_input');
        if (tenurePeriodInput) {
            tenurePeriodInput.addEventListener('input', function () {
                if (this.value.length > 10) {
                    this.value = this.value.slice(0, 10);
                }
            });
        }

        const feePaymentMethod = document.getElementById('fee_payment_method');
        const feeManualSection = document.getElementById('fee-manual-section');
        const feePaymentDocs = document.getElementById('fee_payment_docs');
        if (feePaymentMethod) {
            feePaymentMethod.addEventListener('change', function () {
                if (this.value === 'manual') {
                    feeManualSection.classList.remove('d-none');
                    if (feePaymentDocs) feePaymentDocs.required = true;
                } else {
                    feeManualSection.classList.add('d-none');
                    if (feePaymentDocs) { feePaymentDocs.required = false; feePaymentDocs.value = ''; }
                }
            });
        }

        function autoFitTextarea(el) {
            el.style.height = 'auto';
            el.style.height = el.scrollHeight + 'px';
        }

        document.querySelectorAll('.autofit-textarea').forEach(autoFitTextarea);

        document.addEventListener('input', function (e) {
            if (e.target.matches('.autofit-textarea')) {
                autoFitTextarea(e.target);
            }
        });

        document.addEventListener('click', function (e) {
            if (e.target.matches('[data-repeater-create]')) {
                setTimeout(function () {
                    document.querySelectorAll('.autofit-textarea').forEach(autoFitTextarea);
                }, 0);
            }
        });

        function setupRepeaterNumbering(listSelector) {
            const list = document.querySelector(listSelector);
            if (!list) return;
            function renumber() {
                list.querySelectorAll(':scope > [data-repeater-item]').forEach(function (item, index) {
                    const label = item.querySelector('.item-number');
                    if (label) label.textContent = index + 1;
                });
            }
            renumber();
            new MutationObserver(renumber).observe(list, { childList: true });
        }

        setupRepeaterNumbering('[data-repeater-list="banks"]');
        setupRepeaterNumbering('[data-repeater-list="contracts"]');
        setupRepeaterNumbering('[data-repeater-list="payees"]');

        function setupTableHeaderVisibility(listSelector, theadSelector) {
            const list = document.querySelector(listSelector);
            const thead = document.querySelector(theadSelector);
            if (!list || !thead) return;
            function updateTheadVisibility() {
                const hasRecord = list.querySelectorAll(':scope > [data-repeater-item]').length > 0;
                thead.classList.toggle('d-none', !hasRecord);
            }
            updateTheadVisibility();
            new MutationObserver(updateTheadVisibility).observe(list, { childList: true });
        }

        setupTableHeaderVisibility('[data-repeater-list="shareholders"]', '#shareholder-thead');
        setupTableHeaderVisibility('[data-repeater-list="banks"]', '#bank-thead');

        let scrollTo = "{{ session('scrollTo') ?? request()->query('section') ?? '' }}";
        if (scrollTo) {
            let target = document.getElementById(scrollTo);
            if (target) {
                const navbarOffset = 100;
                const top = target.getBoundingClientRect().top + window.pageYOffset - navbarOffset;
                window.scrollTo({ top, behavior: 'smooth' });
            }
        }

        document.querySelectorAll('form.needs-validation').forEach(function (form) {
            form.addEventListener('submit', function (event) {
                if (!form.checkValidity()) {
                    event.preventDefault();
                    event.stopPropagation();
                    form.classList.add('was-validated');
                }
            });
        });
    });
</script>
@endsection