{{-- Bulk-action dialogs of the Chat loan data list (rendered inside the crmGrid scope). --}}
<x-modal name="loan-assign" title="Assign leads" maxWidth="lg">
    <form method="POST" action="{{ route('loan-data.assign') }}" id="loan-assign-form" class="space-y-5">
        @csrf
        @include('crm.partials.saved-view-selection')
        <p class="text-sm text-ink-500">Creates a telecaller task for each of the <span class="font-semibold text-ink-900 dark:text-white" x-text="count.toLocaleString()"></span> selected lead(s) and stamps today's allocation date.</p>
        @include('crm.loan-data.partials.assign-fields', ['prefix' => 'loan'])
        <div class="grid gap-3 sm:grid-cols-2">
            <fieldset class="rounded-xl border border-ink-200 p-3 dark:border-ink-700">
                <legend class="px-1 text-xs font-semibold text-ink-500">Lead already has another user's task</legend>
                <label class="flex items-start gap-2 py-1 text-sm"><input type="radio" name="mode" value="add" class="mt-0.5" checked> <span>Add a task for this user too</span></label>
                <label class="flex items-start gap-2 py-1 text-sm"><input type="radio" name="mode" value="transfer" class="mt-0.5"> <span>Transfer the latest task to this user</span></label>
            </fieldset>
            <fieldset class="rounded-xl border border-ink-200 p-3 dark:border-ink-700">
                <legend class="px-1 text-xs font-semibold text-ink-500">User already has a task for the lead</legend>
                <label class="flex items-start gap-2 py-1 text-sm"><input type="radio" name="on_existing" value="update" class="mt-0.5" checked> <span>Reset it to Not Started</span></label>
                <label class="flex items-start gap-2 py-1 text-sm"><input type="radio" name="on_existing" value="skip" class="mt-0.5"> <span>Leave it unchanged</span></label>
            </fieldset>
        </div>
    </form>
    <x-slot:footer>
        <button type="button" class="btn btn-secondary" @click="$dispatch('close-modal', 'loan-assign')">Cancel</button>
        <button form="loan-assign-form" class="btn btn-brand"><x-heroicon-m-user-plus class="h-4 w-4" /> Assign</button>
    </x-slot:footer>
</x-modal>

<x-modal name="loan-mass-update" title="Mass update" maxWidth="md">
    <form method="POST" action="{{ route('loan-data.mass-update') }}" id="loan-mass-form" class="space-y-4"
          x-data="{ field: '', options: [], async pick() { this.options = await window.crmPicklist(this.field) } }">
        @csrf
        @include('crm.partials.saved-view-selection')
        <p class="text-sm text-ink-500">Set one field on <span class="font-semibold text-ink-900 dark:text-white" x-text="count.toLocaleString()"></span> selected lead(s). Activity fields change every task of those leads.</p>
        <div>
            <label class="form-label" for="mass_field">Field <span class="text-rose-500">*</span></label>
            <select name="field" id="mass_field" class="form-input" required x-model="field" @change="pick()">
                <option value="">Choose a field…</option>
                @foreach ($massFields as $value => $label)
                    <option value="{{ $value }}">{{ $label }}</option>
                @endforeach
            </select>
        </div>
        <div>
            <label class="form-label" for="mass_value">New value</label>
            <input type="text" name="value" id="mass_value" class="form-input" list="mass-value-options" maxlength="255" placeholder="Leave empty to clear the field">
            <datalist id="mass-value-options"><template x-for="o in options" :key="o"><option :value="o"></option></template></datalist>
            <p class="form-hint" x-show="options.length" x-text="`${options.length} suggested values — start typing to pick one.`"></p>
        </div>
    </form>
    <x-slot:footer>
        <button type="button" class="btn btn-secondary" @click="$dispatch('close-modal', 'loan-mass-update')">Cancel</button>
        <button form="loan-mass-form" class="btn btn-brand" x-data="confirmSubmit('Update the selected records?')" @click="submit">Update</button>
    </x-slot:footer>
</x-modal>

<x-modal name="loan-zoho" title="Update on Zoho CRM" maxWidth="md">
    @if ($zohoConfigured)
        <form method="POST" action="{{ route('loan-data.zoho') }}" id="loan-zoho-form">
            @csrf
            @include('crm.partials.saved-view-selection')
            <p class="text-sm text-ink-600 dark:text-ink-300">Sends the latest task result (remark, subject, status, due date, caller) of up to 500 selected leads to their Zoho contact. Leads without a Zoho id are skipped; only records Zoho accepts are marked “updated”.</p>
        </form>
    @else
        <div class="flex gap-3 rounded-xl bg-amber-50 p-4 text-sm text-amber-800 dark:bg-amber-500/10 dark:text-amber-300">
            <x-heroicon-o-exclamation-triangle class="h-5 w-5 shrink-0" />
            <p>Zoho CRM is not connected on this server yet. Ask an administrator to set <code>ZOHO_CLIENT_ID</code>, <code>ZOHO_CLIENT_SECRET</code> and <code>ZOHO_REFRESH_TOKEN</code>.</p>
        </div>
    @endif
    <x-slot:footer>
        <button type="button" class="btn btn-secondary" @click="$dispatch('close-modal', 'loan-zoho')">Close</button>
        @if ($zohoConfigured)
            <button form="loan-zoho-form" class="btn btn-brand"><x-heroicon-m-cloud-arrow-up class="h-4 w-4" /> Send to Zoho</button>
        @endif
    </x-slot:footer>
</x-modal>

<x-modal name="loan-delete" title="Delete records" maxWidth="md">
    <form method="POST" action="{{ route('loan-data.destroy') }}" id="loan-delete-form" class="space-y-4" x-data="confirmSubmit('Permanently delete the selected records? This cannot be undone.')" @submit="submit">
        @csrf @method('DELETE')
        @include('crm.partials.saved-view-selection')
        <div class="flex gap-3 rounded-xl bg-rose-50 p-4 text-sm text-rose-800 dark:bg-rose-500/10 dark:text-rose-300">
            <x-heroicon-o-exclamation-triangle class="h-5 w-5 shrink-0" />
            <p><span class="font-semibold" x-text="count.toLocaleString()"></span> record(s) will be permanently deleted. This action is logged.</p>
        </div>
        <label class="flex items-start gap-3 rounded-xl border border-ink-200 p-3 text-sm dark:border-ink-700">
            <input type="checkbox" name="with_activities" value="1" class="form-checkbox mt-0.5" checked>
            <span>Also delete their telecaller tasks (otherwise they stay as orphans)</span>
        </label>
    </form>
    <x-slot:footer>
        <button type="button" class="btn btn-secondary" @click="$dispatch('close-modal', 'loan-delete')">Cancel</button>
        <button form="loan-delete-form" class="btn btn-danger"><x-heroicon-m-trash class="h-4 w-4" /> Delete</button>
    </x-slot:footer>
</x-modal>