@php
    use App\Models\Activity;

    $loan = $activity->loanData;
    $contact = $activity->contact;
    $user = auth()->user();
    $pick = fn (string $col) => Activity::firstFilled($loan?->{$col}, $contact?->{$col});
    $name = $activity->displayName() ?? 'Unnamed lead';
    $mobile = $activity->displayMobile();

    // Legacy varchar dates are d-m-Y; <input type=date> needs Y-m-d.
    $dateVal = function (?string $v) {
        if (Activity::isBlank($v)) return null;
        foreach (['d-m-Y', 'Y-m-d', 'd/m/Y'] as $f) {
            try { $d = \Carbon\Carbon::createFromFormat('!'.$f, trim($v)); if ($d && $d->format($f) === trim($v)) return $d->format('Y-m-d'); } catch (\Throwable) {}
        }
        return null;
    };
    $val = fn (string $f) => old($f, $activity->clean($f));

    $allocated = \App\Services\Crm\ActivityListQuery::allocationDate($activity);
    $lead = array_filter([
        'Mobile' => $mobile,
        'Other phone' => $pick('other_phone'),
        'Reg no' => $pick('car_reg_no'),
        'Make' => $pick('mfg_pick_list'),
        'Model' => Activity::firstFilled($contact?->model_picklist, $loan?->model_picklist),
        'Sub model' => $pick('sub_model'),
        'Vahan year' => $pick('vahan_year_pick_list'),
        'Segment' => $pick('car_seg_new'),
        'Fuel' => $pick('fuel_type'),
        'Reg date' => Activity::firstFilled($contact?->reg_date, $loan?->reg_date),
        'HPA' => Activity::firstFilled($contact?->hpa_pick_easy_at_calling_update, $loan?->hpa_pick_easy_at_calling_update),
        'Bank type' => $pick('bank_type_new'),
        'Insurance co.' => $pick('insurance_company_name'),
        'Ins start' => $pick('ins_start_date_new'),
        'Location' => $pick('location'),
        'Dealer' => $pick('dealar_name'),
        'Loan city' => $loan?->loan_chat_type,
        'Data allocated' => $allocated,
        'Note' => $loan?->NOTE,
    ], fn ($v) => ! Activity::isBlank($v));

    $leadLink = null;
    if ($loan) {
        foreach (['contacts.show', 'contacts.edit', 'loan-data.show', 'loan-data.edit'] as $r) {
            if (Route::has($r)) { try { $leadLink = route($r, $loan->id); break; } catch (\Throwable) {} }
        }
    }

    $back = request('back');
    $back = is_string($back) && str_starts_with($back, url('/activities')) ? $back : route('activities.index');

    $sel = fn (string $f) => $options[$f] ?? [];
    $initial = [
        'status' => old('status', $activity->status ?: Activity::STATUS_NOT_STARTED),
        'final_remark_ins_loan' => (string) $val('final_remark_ins_loan'),
        'task_for' => (string) $val('task_for'),
        'inq_status' => (string) $val('inq_status'),
        'field_manager' => (string) $val('field_manager'),
        'exe_remark' => (string) $val('exe_remark'),
        'exe_marking' => (string) $val('exe_marking'),
        'exe_inq_handle' => (string) $val('exe_inq_handle'),
        'source' => (string) $val('source'),
        'due_date' => (string) old('due_date', $activity->due_date?->format('Y-m-d')),
    ];
@endphp
<x-layouts.app :title="$name" :subtitle="collect([$activity->subject, $activity->user ? 'Assigned to '.$activity->user->name : null])->filter()->implode(' · ')"
               :breadcrumbs="['CRM' => null, 'Activities' => $back, 'Lead follow-up' => null]">
    <x-slot:actions>
        @if ($mobile)
            <a href="tel:{{ preg_replace('/[^\d+]/', '', $mobile) }}" class="btn btn-success"><x-heroicon-m-phone class="h-4 w-4" /> Call {{ $mobile }}</a>
        @endif
        <a href="{{ $back }}" class="btn btn-secondary"><x-heroicon-m-arrow-left class="h-4 w-4" /> Back to list</a>
    </x-slot:actions>

    <div class="grid gap-6 xl:grid-cols-3">
        {{-- Lead information (read-only) --}}
        <div class="space-y-6 xl:order-2">
            <x-card :padded="false">
                <div class="flex items-start gap-4 border-b border-ink-100 p-5 dark:border-ink-800">
                    <div class="flex h-12 w-12 shrink-0 items-center justify-center rounded-2xl bg-gradient-to-br from-brand-400 to-orange-500 text-lg font-semibold text-ink-950">
                        {{ mb_strtoupper(mb_substr($name, 0, 1)) }}
                    </div>
                    <div class="min-w-0 flex-1">
                        <h2 class="truncate text-base font-semibold text-ink-900 dark:text-white">{{ $name }}</h2>
                        <div class="mt-1 flex flex-wrap items-center gap-1.5">
                            <span class="badge {{ $activity->statusBadge() }}">{{ $activity->status ?: 'Unknown' }}</span>
                            @if ($activity->clean('task_for'))<span class="badge badge-gray">{{ $activity->clean('task_for') }}</span>@endif
                            @if ($activity->isOverdue())<span class="badge badge-red">Overdue</span>@endif
                        </div>
                    </div>
                </div>
                <dl class="divide-y divide-ink-100 text-sm dark:divide-ink-800">
                    @forelse ($lead as $label => $value)
                        <div class="flex justify-between gap-4 px-5 py-2.5">
                            <dt class="shrink-0 text-ink-500">{{ $label }}</dt>
                            <dd class="text-right font-medium break-words text-ink-800 dark:text-ink-200">{{ $value }}</dd>
                        </div>
                    @empty
                        <div class="px-5 py-6 text-center text-sm text-ink-500">No lead record is linked to this activity.</div>
                    @endforelse
                </dl>
                @if ($leadLink)
                    <x-slot:footer><a href="{{ $leadLink }}" class="text-sm font-medium text-brand-700 hover:underline dark:text-brand-300">Open lead record →</a></x-slot:footer>
                @endif
            </x-card>

            <x-card title="Activity details">
                <dl class="grid grid-cols-2 gap-x-4 gap-y-3 text-sm">
                    <div><dt class="text-xs text-ink-500">Assigned to</dt><dd class="font-medium">{{ $activity->user?->name ?? '—' }}</dd></div>
                    <div><dt class="text-xs text-ink-500">Field manager</dt><dd class="font-medium">{{ $activity->clean('field_manager') ?? '—' }}</dd></div>
                    <div><dt class="text-xs text-ink-500">Due date</dt><dd class="font-medium tabular-nums">{{ $activity->due_date?->format('d-m-Y') ?? '—' }}</dd></div>
                    <div><dt class="text-xs text-ink-500">Last updated</dt><dd class="font-medium tabular-nums">{{ $activity->modified_by?->format('d-m-Y H:i') ?? '—' }}</dd></div>
                    @if ($activity->clean('closed_time'))
                        <div><dt class="text-xs text-ink-500">Closed</dt><dd class="font-medium tabular-nums">{{ $activity->clean('closed_time') }}</dd></div>
                    @endif
                    @if ($activity->clean('app_version'))
                        <div><dt class="text-xs text-ink-500">Mobile app</dt><dd class="font-medium">v{{ $activity->app_version }}</dd></div>
                    @endif
                    <div><dt class="text-xs text-ink-500">Activity ID</dt><dd class="font-medium tabular-nums">#{{ $activity->id }}</dd></div>
                </dl>
            </x-card>

            @if ($related->isNotEmpty())
                <x-card title="Other activities on this lead" :padded="false">
                    <ul class="divide-y divide-ink-100 text-sm dark:divide-ink-800">
                        @foreach ($related as $r)
                            <li><a href="{{ route('activities.show', $r) }}" class="flex items-center justify-between gap-3 px-5 py-2.5 hover:bg-ink-50 dark:hover:bg-ink-800/50">
                                <span class="min-w-0"><span class="block truncate font-medium">{{ $r->user?->name ?? 'Unassigned' }}</span><span class="text-xs text-ink-500">{{ $r->clean('final_remark_ins_loan') ?? 'No remark' }}</span></span>
                                <span class="badge {{ $r->statusBadge() }}">{{ $r->status }}</span>
                            </a></li>
                        @endforeach
                    </ul>
                </x-card>
            @endif

            <x-card title="Timeline" subtitle="Changes made in Top Gear CRM">
                @if ($history->isEmpty())
                    <p class="text-sm text-ink-500">No changes recorded yet.</p>
                @else
                    <ol class="relative space-y-4 border-l border-ink-200 pl-5 dark:border-ink-700">
                        @foreach ($history as $h)
                            @php($meta = json_decode($h->meta ?? '[]', true) ?: [])
                            <li class="relative">
                                <span class="absolute top-1 -left-[25px] h-2.5 w-2.5 rounded-full bg-brand-500 ring-4 ring-white dark:ring-ink-900"></span>
                                <div class="text-sm font-medium text-ink-800 dark:text-ink-200">
                                    @switch($h->action)
                                        @case('activity.updated') Follow-up saved @break
                                        @case('activity.sms_field_manager') Lead SMS sent ({{ $meta['sent'] ?? 0 }}) @break
                                        @default {{ $h->action }}
                                    @endswitch
                                </div>
                                <div class="text-xs text-ink-500">{{ $h->name ?? 'System' }} · {{ \Carbon\Carbon::parse($h->created_at)->format('d-m-Y H:i') }}</div>
                                @if (! empty($meta['status']) && $meta['status'][0] !== $meta['status'][1])
                                    <div class="mt-1 text-xs text-ink-600 dark:text-ink-400">Status: {{ $meta['status'][0] ?? '—' }} → <span class="font-medium">{{ $meta['status'][1] }}</span></div>
                                @endif
                                @if (! empty($meta['final_remark']) && $meta['final_remark'][0] !== $meta['final_remark'][1])
                                    <div class="text-xs text-ink-600 dark:text-ink-400">Remark: {{ $meta['final_remark'][0] ?? '—' }} → <span class="font-medium">{{ $meta['final_remark'][1] ?? '—' }}</span></div>
                                @endif
                            </li>
                        @endforeach
                    </ol>
                @endif
            </x-card>
        </div>

        {{-- Follow-up form --}}
        <div class="xl:col-span-2 xl:order-1">
            <form method="POST" action="{{ route('activities.update', $activity) }}" class="space-y-6"
                  x-data="activityFollowUp(@js($initial), @js($rules), @js($followUpDate), @js($managerMobiles), @js($activity->due_date?->format('Y-m-d')))">
                @csrf
                @method('PUT')
                <input type="hidden" name="return_to" value="{{ $back }}">

                <x-card title="Lead follow-up" subtitle="Status, follow-up date and inquiry status update automatically from the final remark.">
                    <div class="grid gap-4 sm:grid-cols-2">
                        <x-input name="subject" label="Subject" :value="$val('subject')" :readonly="$user->hasRole(\App\Enums\Role::SalesManager)" maxlength="200" />
                        <x-select name="task_owner" label="Task owner" :options="array_values(array_unique(array_filter(array_merge(\App\Services\Crm\ActivityOptions::TASK_OWNERS, [$activity->clean('task_owner')]))))" :value="$val('task_owner')" placeholder="None" />
                        <x-select name="task_for" label="Task for" :options="$sel('task_for')" placeholder="None" x-model="form.task_for" x-on:change="onRemarkChange()" />
                        <x-select name="ins_bank_name" label="Insurance / bank name" :options="$sel('ins_bank_name')" :value="$val('ins_bank_name')" placeholder="None" :enhance="true" />
                        <div class="sm:col-span-2">
                            <x-select name="final_remark_ins_loan" label="Final remark (ins / loan)" :options="$sel('final_remark_ins_loan')" placeholder="None"
                                      x-model="form.final_remark_ins_loan" x-on:change="onRemarkChange()" />
                            <p class="form-hint" x-show="hint" x-text="hint" x-cloak></p>
                        </div>
                        <div>
                            <x-select name="status" label="Status" :options="$sel('status')" required x-model="form.status" />
                            <p class="form-hint" x-show="derived" x-cloak>Set automatically from the final remark.</p>
                        </div>
                        <div>
                            <label for="due_date" class="form-label">Follow-up due date</label>
                            <input type="date" name="due_date" id="due_date" class="form-input {{ $errors->has('due_date') ? 'border-rose-400' : '' }}"
                                   x-model="form.due_date" :min="form.due_date === originalDue ? null : today" :max="maxDue">
                            @error('due_date')<p class="form-error">{{ $message }}</p>@enderror
                            <p class="form-hint">Today up to {{ \App\Services\Crm\ActivityRules::MAX_DUE_DAYS }} days ahead.</p>
                        </div>
                        <x-textarea name="special_remark" label="Special remark (sales manager)" :value="$val('special_remark')" rows="2" class="sm:col-span-2" />
                    </div>
                </x-card>

                {{-- Inquiry (final remark = INQ GENERATED) --}}
                <div x-show="sections.inquiry" x-collapse x-cloak>
                    <x-card title="Inquiry" subtitle="Inquiry status and hand-over to a field manager.">
                        <div class="grid gap-4 sm:grid-cols-2">
                            <x-select name="inq_status" label="Inquiry status" :options="$sel('inq_status')" placeholder="None" x-model="form.inq_status" />
                            <x-select name="field_manager" label="Field manager" :options="$sel('field_manager')" placeholder="None" x-model="form.field_manager" />
                            <div>
                                <label class="form-label">Field manager mobile</label>
                                <input type="text" class="form-input" :value="managerMobile || '—'" readonly tabindex="-1">
                            </div>
                            <div x-show="sections.reject" x-cloak>
                                <x-select name="rejectreason" label="Reject reason" :options="$sel('rejectreason')" :value="$val('rejectreason')" placeholder="None" />
                            </div>
                            <div x-show="sections.loan_amount" x-cloak>
                                <x-input name="loanamount" label="Loan amount (₹)" type="number" min="0" step="1" :value="$val('loanamount')" />
                            </div>
                            <label class="flex items-start gap-2 rounded-xl border border-ink-200 p-3 text-sm sm:col-span-2 dark:border-ink-700"
                                   x-show="form.inq_status && form.field_manager">
                                <input type="hidden" name="send_sms" value="0">
                                <input type="checkbox" name="send_sms" value="1" class="form-checkbox mt-0.5" @checked(old('send_sms', true))>
                                <span><span class="font-medium text-ink-800 dark:text-ink-200">Send the lead by SMS on save</span>
                                    <span class="block text-xs text-ink-500">Lead details go to the field manager and to the activity owner.</span></span>
                            </label>
                        </div>
                    </x-card>
                </div>

                {{-- Executive update (inq status = SEND EXE FOR CONVINCE) --}}
                <div x-show="sections.exe" x-collapse x-cloak>
                    <x-card title="Executive update" subtitle="Field executive's feedback on the inquiry.">
                        <div class="grid gap-4 sm:grid-cols-2">
                            <x-select name="exe_remark" label="Exe remark" :options="$sel('exe_remark')" placeholder="None" x-model="form.exe_remark" x-on:change="onExeChange()" />
                            <x-select name="exe_inq_handle" label="Exe inquiry handled on" :options="$sel('exe_inq_handle')" placeholder="None" x-model="form.exe_inq_handle" />
                            <x-select name="exe_marking" label="Exe marking" :options="$sel('exe_marking')" placeholder="None" x-model="form.exe_marking" />
                            <x-select name="source" label="Source" :options="$sel('source')" placeholder="None" x-model="form.source" />
                        </div>
                    </x-card>
                </div>

                {{-- Loan disbursement (inq status = DISB) --}}
                <div x-show="sections.disbursement" x-collapse x-cloak>
                    <x-card title="Loan disbursed by us" subtitle="Disbursement details.">
                        <div class="grid gap-4 sm:grid-cols-3">
                            <x-input name="disb_loan_amount" label="Disb loan amount (₹)" type="number" min="0" step="1" :value="$val('disb_loan_amount')" />
                            <x-input name="disb_bank_rate" label="Disb bank rate (%)" type="number" min="0" max="100" step="0.01" :value="$val('disb_bank_rate')" />
                            <x-input name="disb_tnr" label="Disb tenure (months)" type="number" min="0" step="1" :value="$val('disb_tnr')" />
                            <x-input name="disb_emi" label="Disb EMI (₹)" type="number" min="0" step="1" :value="$val('disb_emi')" />
                            <x-input name="pf_deatil" label="PF detail (₹)" type="number" min="0" step="1" :value="$val('pf_deatil')" />
                            <x-select name="cat_a_status" label="CAT A status" :options="$sel('cat_a_status')" :value="$val('cat_a_status')" placeholder="None" />
                            <x-select name="suraksha_kavach" label="Suraksha kavach" :options="$sel('suraksha_kavach')" :value="$val('suraksha_kavach')" placeholder="None" />
                            <x-input name="pdc_start_date" label="PDC start date" type="date" :value="$dateVal($activity->pdc_start_date)" />
                            <x-input name="disb_ins_exp_date" label="Disb ins expiry date" type="date" :value="$dateVal($activity->disb_ins_exp_date)" />
                            <x-select name="disb_in_fev_off" label="Disb in fev off" :options="$sel('disb_in_fev_off')" :value="$val('disb_in_fev_off')" placeholder="None" />
                            <x-select name="loan_business_finance_co_name" label="Loan business finance co." :options="$sel('loan_business_finance_co_name')" :value="$val('loan_business_finance_co_name')" placeholder="None" />
                            <x-select name="loan_disb_count_month" label="Loan disb count month" :options="$sel('loan_disb_count_month')" :value="$val('loan_disb_count_month')" placeholder="None" />
                            <x-select name="disb_product" label="Disb product" :options="$sel('disb_product')" :value="$val('disb_product')" placeholder="None" />
                            <x-select name="disb_ins_business" label="Disb ins business" :options="$sel('disb_ins_business')" :value="$val('disb_ins_business')" placeholder="None" />
                            <x-input name="sales_manager" label="Sales manager" :value="$val('sales_manager')" maxlength="150" />
                        </div>
                    </x-card>
                </div>

                {{-- Login details (inq status = LOGIN) --}}
                <div x-show="sections.login" x-collapse x-cloak>
                    <x-card title="Team / login details" subtitle="Valuation and loan login.">
                        <div class="grid gap-4 sm:grid-cols-3">
                            <x-input name="valuation_ammount" label="Valuation amount (₹)" type="number" min="0" step="1" :value="$val('valuation_ammount')" />
                            <x-select name="inspection_type" label="Inspection type" :options="$sel('inspection_type')" :value="$val('inspection_type')" placeholder="None" />
                            <x-select name="valuater_name" label="Valuer name" :options="$sel('valuater_name')" :value="$val('valuater_name')" placeholder="None" />
                            <x-input name="valuation_month" label="Valuation date" type="date" :value="$dateVal($activity->valuation_month)" />
                            <x-input name="new_login_disb_los" label="New login / disb LOS" type="number" min="0" step="1" :value="$val('new_login_disb_los')" />
                            <x-input name="login_los_no" label="Login LOS no" type="number" min="0" step="1" :value="$val('login_los_no')" />
                            <x-select name="login_month" label="Login month" :options="$sel('login_month')" :value="$val('login_month')" placeholder="None" hint="Used by the dashboard loan figures." />
                            <x-input name="login_date" label="Login date" type="date" :value="$dateVal($activity->login_date)" />
                            <x-select name="loginbank" label="Login bank" :options="$sel('loginbank')" :value="$val('loginbank')" placeholder="None" />
                            <x-select name="loanproduct" label="Loan product" :options="$sel('loanproduct')" :value="$val('loanproduct')" placeholder="None" />
                            <x-select name="catrequire" label="CAT require" :options="$sel('catrequire')" :value="$val('catrequire')" placeholder="None" />
                            <x-select name="vender_code" label="Vendor code" :options="$sel('vender_code')" :value="$val('vender_code')" placeholder="None" />
                        </div>
                    </x-card>
                </div>

                <x-card title="Notepad">
                    <x-textarea name="notpad" :value="$val('notpad')" rows="4" placeholder="Private notes about this lead…" />
                </x-card>

                <div class="sticky bottom-4 z-10 flex flex-wrap items-center justify-end gap-2 rounded-2xl border border-ink-200 bg-white/90 p-3 shadow-lg backdrop-blur dark:border-ink-700 dark:bg-ink-900/90">
                    <span class="mr-auto hidden text-xs text-ink-500 sm:block">Status after save: <span class="font-medium text-ink-800 dark:text-ink-200" x-text="form.status"></span></span>
                    <a href="{{ $back }}" class="btn btn-secondary">Cancel</a>
                    <button name="stay" value="1" class="btn btn-secondary">Save &amp; stay</button>
                    <button class="btn btn-brand"><x-heroicon-m-check class="h-4 w-4" /> Save follow-up</button>
                </div>
            </form>
        </div>
    </div>

    @push('scripts')
        <script>
            document.addEventListener('alpine:init', () => {
                window.Alpine.data('activityFollowUp', (initial, rules, followUpDate, managerMobiles, originalDue) => {
                    const norm = (v) => String(v ?? '').trim().toUpperCase();
                    const pad = (n) => String(n).padStart(2, '0');
                    const iso = (d) => `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;
                    const now = new Date();
                    const max = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 30);
                    return {
                        form: { ...initial },
                        originalDue,
                        today: iso(now),
                        maxDue: iso(max),
                        hint: '',
                        get isInquiry() { return rules.inquiry.includes(norm(this.form.final_remark_ins_loan)); },
                        get sections() {
                            const inq = this.isInquiry ? norm(this.form.inq_status) : '';
                            return { inquiry: this.isInquiry, reject: inq === 'REJECT', loan_amount: ['APPROVED', 'REJECT'].includes(inq),
                                     exe: inq === 'SEND EXE FOR CONVINCE', disbursement: inq === 'DISB', login: inq === 'LOGIN' };
                        },
                        get derived() { return this.derive() !== null; },
                        get managerMobile() { return managerMobiles[this.form.field_manager] || ''; },
                        derive() {
                            const remark = norm(this.form.final_remark_ins_loan), task = norm(this.form.task_for);
                            if (!remark) return null;
                            if (rules.completingRemarks.includes(remark) && rules.completingTasks.includes(task)) return 'Completed';
                            if (rules.inProgressRemarks.includes(remark) || rules.inProgressTasks.includes(task)) return 'In Progress';
                            return null;
                        },
                        onRemarkChange() {
                            const status = this.derive();
                            if (status) this.form.status = status;
                            this.hint = '';
                            if (!this.isInquiry) this.form.inq_status = '';
                            if (rules.followUpRemarks.includes(norm(this.form.final_remark_ins_loan))) {
                                this.form.inq_status = '';
                                this.form.due_date = followUpDate;
                                this.hint = 'Not reachable — follow-up scheduled in 3 days.';
                            }
                        },
                        onExeChange() {
                            const r = norm(this.form.exe_remark);
                            if (rules.exePositive.includes(r)) {
                                Object.assign(this.form, { exe_marking: 'HOT INQ', exe_inq_handle: 'CUST PLACE', source: 'DIRECT' });
                            } else if (rules.exeNegative.includes(r)) {
                                Object.assign(this.form, { exe_marking: 'NEGATIVE', source: 'DIRECT' });
                                window.toast('Negative executive remark: the final remark will be set to “' + rules.exeNegativeRemark + '” on save.');
                            } else if (rules.exeCallback.includes(r)) {
                                Object.assign(this.form, { exe_marking: '', source: '', exe_inq_handle: '' });
                            }
                        },
                    };
                });
            });
        </script>
    @endpush
</x-layouts.app>