{{-- Modal partial — injected into #myModal .modal-content --}}
<div class="modal-header" style="background:#16C4C0;">
    <h5 class="modal-title text-white">
        {{ isset($template) ? 'Edit Application Information' : 'Add New Application' }}
    </h5>
    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>

<form action="{{ isset($template) ? route('manages.pdf-mappings.update', $template->id) : route('manages.pdf-mappings.store') }}"
      method="POST"
      enctype="multipart/form-data"
      class="custom-validation"
      id="pdfTemplateForm">
    @csrf
    @if(isset($template))
        @method('PUT')
    @endif

    <div class="modal-body">
        {{-- Category --}}
        <div class="row mb-2 align-items-center">
            <div class="col-4"><label class="small fw-semibold mb-0">Category: <span class="text-danger">*</span></label></div>
            <div class="col-8">
                <select class="form-control select2" name="pdf_template_category_id" required>
                    <option value="">-- Select --</option>
                    @foreach($categories ?? [] as $cat)
                    <option value="{{ $cat->id }}" {{ (old('pdf_template_category_id', $template->pdf_template_category_id ?? '') == $cat->id) ? 'selected' : '' }}>
                        {{ $cat->title }}
                    </option>
                    @endforeach
                </select>
            </div>
        </div>

        {{-- Application Type --}}
        <div class="row mb-2 align-items-center">
            <div class="col-4"><label class="small fw-semibold mb-0">Application Type: <span class="text-danger">*</span></label></div>
            <div class="col-8">
                <select class="form-control select2 no-search" name="application_type" id="applicationTypeSelect" required>
                    <option value="1" {{ (old('application_type', $template->application_type ?? 1) == 1) ? 'selected' : '' }}>Generic Form</option>
                    <option value="2" {{ (old('application_type', $template->application_type ?? 1) == 2) ? 'selected' : '' }}>eSignature Application</option>
                </select>
            </div>
        </div>

        {{-- Display Title --}}
        <div class="row mb-2 align-items-center">
            <div class="col-4"><label class="small fw-semibold mb-0">Display Title: <span class="text-danger">*</span></label></div>
            <div class="col-8">
                <input type="text" class="form-control" name="name"
                       value="{{ old('name', $template->name ?? '') }}" required>
            </div>
        </div>

        {{-- Document Name --}}
        <div class="row mb-2 align-items-center">
            <div class="col-4"><label class="small fw-semibold mb-0">Document Name: <span class="text-danger">*</span></label></div>
            <div class="col-8">
                <input type="text" class="form-control" name="document_name"
                       value="{{ old('document_name', $template->document_name ?? '') }}" required>
            </div>
        </div>

        {{-- Label --}}
        <div class="row mb-2 align-items-center">
            <div class="col-4"><label class="small fw-semibold mb-0">Label: <span class="text-danger">*</span></label></div>
            <div class="col-8">
                <select class="form-control select2" name="label" required>
                    @php
                        $labels = ['MPA','Merchant Statement','Check','MPA & Void Check','Confirmation Page','MPA & Confirmation Page','MPA & Confirmation Page & Void Check','Government Issued ID','Proof of Business','W9 Form'];
                        $currentLabel = old('label', $template->label ?? 'MPA');
                    @endphp
                    @foreach($labels as $lbl)
                    <option value="{{ $lbl }}" {{ $currentLabel == $lbl ? 'selected' : '' }}>{{ $lbl }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        {{-- PDF File Upload (create only) --}}
        @if(!isset($template))
        <div class="row mb-2 align-items-center">
            <div class="col-4"><label class="small fw-semibold mb-0">Upload File</label></div>
            <div class="col-8">
                <div class="d-flex align-items-center gap-2">
                    <label class="green-btn-inner waves-effect btn-sm" for="pdfFileInput" style="cursor:pointer; padding:6px 12px;">
                        <i class="bx bx-upload"></i> Upload File
                    </label>
                    <input type="file" id="pdfFileInput" name="pdf_file" accept=".pdf" class="d-none" required>
                    <span class="text-danger small" id="fileStatus">* No file attached</span>
                </div>
            </div>
        </div>
        @endif

        {{-- eSignature Options (shown when application_type = 2) --}}
        <div id="esignOptionsSection" class="{{ (isset($template) && ($template->application_type ?? 1) == 2) ? '' : 'd-none' }}">
            <hr class="my-2">
            <strong>eSignature Options</strong>

            {{-- Email Template --}}
            <div class="row mb-2 mt-2 align-items-center">
                <div class="col-4"><label class="small fw-semibold mb-0">Email Template: <span class="text-danger">*</span></label></div>
                <div class="col-8">
                    <select class="form-control select2" name="esign_email_template_id">
                        <option value="">-- Select --</option>
                        @foreach($emailTemplates ?? [] as $et)
                        <option value="{{ $et->id }}" {{ (old('esign_email_template_id', $template->esign_email_template_id ?? '') == $et->id) ? 'selected' : '' }}>
                            {{ $et->template_name }}
                        </option>
                        @endforeach
                    </select>
                </div>
            </div>

            {{-- Signed Template --}}
            <div class="row mb-2 align-items-center">
                <div class="col-4"><label class="small fw-semibold mb-0">Signed Template: <span class="text-danger">*</span></label></div>
                <div class="col-8">
                    <select class="form-control select2" name="esign_signed_template_id">
                        <option value="">-- Select --</option>
                        @foreach($emailTemplates ?? [] as $et)
                        <option value="{{ $et->id }}" {{ (old('esign_signed_template_id', $template->esign_signed_template_id ?? '') == $et->id) ? 'selected' : '' }}>
                            {{ $et->template_name }}
                        </option>
                        @endforeach
                    </select>
                </div>
            </div>

            {{-- Signed Notification --}}
            <div class="row mb-2 align-items-center">
                <div class="col-4"><label class="small fw-semibold mb-0">Signed Notification: <span class="text-danger">*</span></label></div>
                <div class="col-8">
                    @php($notif = old('esign_signed_notification', $template->esign_signed_notification ?? 'sender_recipients'))
                    <select class="form-control select2 no-search" name="esign_signed_notification">
                        <option value="sender_recipients" {{ $notif == 'sender_recipients' ? 'selected' : '' }}>Sender & Recipients</option>
                        <option value="sender" {{ $notif == 'sender' ? 'selected' : '' }}>Sender Only</option>
                        <option value="recipients" {{ $notif == 'recipients' ? 'selected' : '' }}>Recipients Only</option>
                    </select>
                    <div class="project-checkbox mt-1">
                        <input type="checkbox" name="esign_do_not_send_to_sender" id="doNotSendSender" value="1"
                               {{ old('esign_do_not_send_to_sender', $template->esign_do_not_send_to_sender ?? false) ? 'checked' : '' }}>
                        <label for="doNotSendSender">Do Not Send Document to Sender</label>
                    </div>
                </div>
            </div>

            {{-- Signed Lead Status --}}
            <div class="row mb-2 align-items-center">
                <div class="col-4"><label class="small fw-semibold mb-0">Signed Lead Status:</label></div>
                <div class="col-8">
                    <select class="form-control select2" name="esign_signed_lead_status_id">
                        <option value="">No Change</option>
                        @foreach($leadStatuses ?? [] as $s)
                        <option value="{{ $s->id }}" {{ (old('esign_signed_lead_status_id', $template->esign_signed_lead_status_id ?? '') == $s->id) ? 'selected' : '' }}>
                            {{ $s->title }}
                        </option>
                        @endforeach
                    </select>
                </div>
            </div>

            {{-- Password Field --}}
            <div class="row mb-2 align-items-center">
                <div class="col-4"><label class="small fw-semibold mb-0">Password Field:</label></div>
                <div class="col-8">
                    <select class="form-control select2" name="esign_password_field">
                        <option value="none">None</option>
                        @foreach($leadFields ?? [] as $f)
                        <option value="{{ $f->slug }}" {{ (old('esign_password_field', $template->esign_password_field ?? 'none') == $f->slug) ? 'selected' : '' }}>
                            {{ $f->label }}
                        </option>
                        @endforeach
                    </select>
                </div>
            </div>

            {{-- Label (second label for e-sign) --}}
            <div class="row mb-2 align-items-center">
                <div class="col-4"><label class="small fw-semibold mb-0">Label: <span class="text-danger">*</span></label></div>
                <div class="col-8">
                    <select class="form-control select2" name="esign_label">
                        @foreach($labels as $lbl)
                        <option value="{{ $lbl }}" {{ (old('esign_label', $template->label ?? 'MPA') == $lbl) ? 'selected' : '' }}>{{ $lbl }}</option>
                        @endforeach
                    </select>
                </div>
            </div>

            {{-- Confirmation Page --}}
            <div class="row mb-2 align-items-center">
                <div class="col-4"><label class="small fw-semibold mb-0">Confirmation Page: <span class="text-danger">*</span></label></div>
                <div class="col-8">
                    <select class="form-control select2" name="esign_confirmation_page_id">
                        <option value="">-- Select --</option>
                        @foreach($emailTemplates ?? [] as $et)
                        <option value="{{ $et->id }}" {{ (old('esign_confirmation_page_id', $template->esign_confirmation_page_id ?? '') == $et->id) ? 'selected' : '' }}>
                            {{ $et->template_name }}
                        </option>
                        @endforeach
                    </select>
                </div>
            </div>

            {{-- Help Banner --}}
            <div class="row mb-2 align-items-center">
                <div class="col-4"><label class="small fw-semibold mb-0">Help Banner:</label></div>
                <div class="col-8">
                    <select class="form-control select2" name="esign_help_banner">
                        <option value="">N/A</option>
                        @foreach($emailTemplates ?? [] as $et)
                        <option value="{{ $et->template_name }}" {{ (old('esign_help_banner', $template->esign_help_banner ?? '') == $et->template_name) ? 'selected' : '' }}>
                            {{ $et->template_name }}
                        </option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>
    </div>

    <div class="modal-footer">
        <button type="button" class="black-btn-inner waves-effect btn-sm" data-bs-dismiss="modal">
            <i class="bx bx-x"></i> Cancel
        </button>
        <button type="submit" class="green-btn-inner waves-effect btn-sm" id="btnSubmitPdfTemplate">
            <i class="bx bx-check"></i> Save
        </button>
    </div>
</form>

<script>
(function($) {
    // File input label
    $('#pdfFileInput').on('change', function() {
        var name = this.files[0] ? this.files[0].name : '* No file attached';
        $('#fileStatus').text(name).toggleClass('text-danger', !this.files[0]).toggleClass('text-success', !!this.files[0]);
    });

    // Toggle e-sign options on type change
    $('#applicationTypeSelect').on('change', function() {
        if ($(this).val() === '2') {
            $('#esignOptionsSection').removeClass('d-none');
        } else {
            $('#esignOptionsSection').addClass('d-none');
        }
    });

    // Initialize select2 inside modal
    if (typeof $.fn.select2 !== 'undefined') {
        $('#pdfTemplateForm .select2').each(function() {
            var config = { width: '100%', dropdownParent: $(this).closest('.modal') };
            if ($(this).hasClass('no-search')) config.minimumResultsForSearch = Infinity;
            if ($(this).data('placeholder')) {
                config.placeholder = $(this).data('placeholder');
                config.allowClear = true;
            }
            $(this).select2(config);
        });
    }

    // Form submission
    var form = document.getElementById('pdfTemplateForm');
    if (form) {
        form.addEventListener('submit', function() {
            var btn = document.getElementById('btnSubmitPdfTemplate');
            if (btn) { btn.disabled = true; btn.innerHTML = '<span class="spinner-border spinner-border-sm me-1"></span> Saving...'; }
        });
    }
})(jQuery);
</script>