@extends('layouts.app')

@section('title', 'Lead — ' . ($lead->requirement ? $lead->requirement->title : 'Detail'))
@section('page-title', 'Lead Detail')

@push('styles')
<style>
.stage-bar { display: flex; gap: 0; overflow-x: auto; }
.stage-bar-item {
    flex: 0 0 auto; width: 150px;
    padding: 6px 10px 6px 20px;
    font-size: 0.72rem; font-weight: 600;
    color: #fff; position: relative;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%, 10px 50%);
    background: #dee2e6; color: #6c757d;
    text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.stage-bar-item:first-child { clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%); }
.stage-bar-item.active { color: #fff !important; }
.stage-bar-item.done   { opacity: 0.7; }
.property-search-result { cursor: pointer; transition: background .15s; }
.property-search-result:hover { background: #f8f9fa; }
</style>
@endpush

@section('content')
@php
    $req              = $lead->requirement;
    $client           = $req ? $req->client : null;
    $shortlisted      = $lead->shortlistedProperties;
    $removalReasons   = \App\Models\PropertyShortlist::REMOVAL_REASONS;
    $siteVisits       = $lead->siteVisits;
    $pendingReminders = $lead->reminders->where('is_done', false);
    $quotes           = $lead->quotes;
    $agreement        = $lead->agreement;
    $defaultDealType  = ($req && $req->interest_type === 'rent') ? 'rental' : 'sale';
    $agreementIsExpired = $agreement && $agreement->isActive()
        && $agreement->isRental()
        && $agreement->agreement_end_date
        && $agreement->agreement_end_date->lt(\Carbon\Carbon::today());
@endphp

<div class="d-flex justify-content-between align-items-center mb-4">
    <a href="{{ route('admin.leads.index') }}" class="btn btn-sm btn-light">
        <i class="bi bi-arrow-left me-1"></i> Back to Leads
    </a>
    <div class="d-flex gap-2 flex-wrap">
        <button class="btn btn-outline-warning btn-sm" data-bs-toggle="modal" data-bs-target="#createReminderModal">
            <i class="bi bi-bell-plus me-1"></i> Set Reminder
        </button>
        <button class="btn btn-outline-success btn-sm" data-bs-toggle="modal" data-bs-target="#logQuoteModal">
            <i class="bi bi-cash-stack me-1"></i> Log Quote
        </button>
        @if(! $agreement || ! $agreement->isActive() || $agreementIsExpired)
        @if($lead->isOpen())
        <button class="btn btn-success btn-sm" data-bs-toggle="modal" data-bs-target="#recordDealModal">
            <i class="bi bi-file-earmark-check me-1"></i> Record Deal
        </button>
        @endif
        @endif
        @if($lead->isOpen())
        <button class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#changeStageModal">
            <i class="bi bi-arrow-right-circle me-1"></i> Change Stage
        </button>
        @endif
    </div>
</div>

{{-- Client & Requirement Header --}}
<div class="card border-0 shadow-sm mb-4">
    <div class="card-body">
        <div class="row g-4">
            <div class="col-md-6">
                <div class="text-muted small fw-medium text-uppercase mb-1" style="letter-spacing:.05em">Client</div>
                @if($client)
                <div class="fw-semibold fs-6">
                    <a href="{{ route('admin.client.show', $client) }}" class="text-decoration-none">
                        {{ $client->full_name }}
                    </a>
                </div>
                <div class="text-muted small">{{ $client->mobile }}{{ $client->email ? ' · ' . $client->email : '' }}</div>
                @else
                <span class="text-muted">—</span>
                @endif
            </div>
            <div class="col-md-6">
                <div class="text-muted small fw-medium text-uppercase mb-1" style="letter-spacing:.05em">Requirement</div>
                @if($req)
                <div class="fw-semibold">{{ $req->title }}</div>
                <div class="text-muted small">
                    {{ \App\Services\ClientRequirementService::formatBudget($req->min_budget, $req->max_budget) }}
                    @if($req->preferred_location) · {{ $req->preferred_location }} @endif
                </div>
                <div class="mt-1">
                    <span class="badge bg-{{ $req->status === 'active' ? 'success' : 'secondary' }} bg-opacity-10
                                        text-{{ $req->status === 'active' ? 'success' : 'secondary' }}">
                        {{ ucfirst($req->status) }}
                    </span>
                </div>
                @else
                <span class="text-muted">—</span>
                @endif
            </div>
        </div>
        <hr class="my-3">
        <div class="row g-3 small text-muted">
            <div class="col-auto">
                <i class="bi bi-person me-1"></i>
                Assigned: <span class="text-dark fw-medium">{{ $lead->assignedTo ? $lead->assignedTo->name : 'Unassigned' }}</span>
            </div>
            <div class="col-auto">
                <i class="bi bi-calendar me-1"></i>
                Created: <span class="text-dark">{{ $lead->created_at->format('d M Y') }}</span>
            </div>
            <div class="col-auto">
                <i class="bi bi-clock me-1"></i>
                Last Activity: <span class="text-dark">{{ $lead->last_activity_at ? $lead->last_activity_at->diffForHumans() : '—' }}</span>
            </div>
        </div>
    </div>
</div>

{{-- Stage Progress Bar --}}
<div class="card border-0 shadow-sm mb-4">
    <div class="card-body">
        <div class="fw-semibold mb-3 small text-muted text-uppercase" style="letter-spacing:.05em">Pipeline Progress</div>
        <div class="stage-bar">
            @foreach($reachedStages as $stage)
            @php $isCurrent = $lead->current_stage_id === $stage->id; @endphp
            <div class="stage-bar-item {{ $isCurrent ? 'active' : 'done' }}"
                 style="background-color: {{ $stage->color }}; color:#fff"
                 title="{{ $stage->name }}">
                {{ $stage->name }}
            </div>
            @endforeach
        </div>
        <div class="mt-3 d-flex align-items-center gap-2">
            @if($lead->currentStage)
                <span class="badge" style="background-color: {{ $lead->currentStage->color }}; font-size:0.8rem">
                    {{ $lead->currentStage->name }}
                </span>
                <span class="text-muted small">{{ $lead->days_in_stage }} day{{ $lead->days_in_stage == 1 ? '' : 's' }} in this stage</span>
            @else
                <span class="text-muted small">No stage assigned</span>
            @endif
        </div>
    </div>
</div>

{{-- Stage Transition History --}}
<div class="card border-0 shadow-sm mb-4">
    <div class="card-header bg-white border-0 pt-3 pb-0">
        <h6 class="fw-semibold mb-0">Stage History</h6>
    </div>
    <div class="table-responsive">
        <table class="table table-sm align-middle mb-0">
            <thead class="table-light">
                <tr>
                    <th>From</th>
                    <th>To</th>
                    <th>Changed By</th>
                    <th>Note</th>
                    <th>Date / Time</th>
                </tr>
            </thead>
            <tbody>
                @forelse($lead->transitions as $transition)
                <tr>
                    <td>
                        @if($transition->fromStage)
                            <span class="badge" style="background-color: {{ $transition->fromStage->color }}">
                                {{ $transition->fromStage->name }}
                            </span>
                        @else
                            <span class="text-muted small">— (Created)</span>
                        @endif
                    </td>
                    <td>
                        <span class="badge" style="background-color: {{ $transition->toStage->color }}">
                            {{ $transition->toStage->name }}
                        </span>
                    </td>
                    <td class="small">{{ $transition->changedBy ? $transition->changedBy->name : '—' }}</td>
                    <td class="small text-muted" style="max-width:300px">{{ $transition->note }}</td>
                    <td class="small text-muted text-nowrap">{{ $transition->created_at->format('d M Y, h:i A') }}</td>
                </tr>
                @empty
                <tr>
                    <td colspan="5" class="text-center py-3 text-muted small">No stage transitions recorded.</td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>

{{-- Shortlisted Properties --}}
<div class="card border-0 shadow-sm mb-4" id="shortlisted">
    <div class="card-header bg-white border-0 pt-3 pb-0 d-flex align-items-center justify-content-between">
        <h6 class="fw-semibold mb-0">
            <i class="bi bi-bookmark-star me-2 text-primary"></i>Shortlisted Properties
            <span class="badge bg-secondary bg-opacity-10 text-secondary ms-1">{{ $shortlisted->count() }}</span>
        </h6>
        @if($lead->isOpen())
        <button class="btn btn-sm btn-outline-primary" data-bs-toggle="collapse" data-bs-target="#searchPanel">
            <i class="bi bi-search me-1"></i>Search &amp; Add
        </button>
        @endif
    </div>

    @if($lead->isOpen())
    {{-- AJAX search panel --}}
    <div class="collapse" id="searchPanel">
        <div class="card-body border-top py-3">
            <div class="row g-2 mb-3">
                <div class="col-md-4">
                    <input type="text" id="sl-search-q" class="form-control form-control-sm"
                           placeholder="Title / location / city…">
                </div>
                <div class="col-md-2">
                    <select id="sl-search-type" class="form-select form-select-sm">
                        <option value="">All Types</option>
                        @foreach(\App\Models\Property::typeLabels() as $val => $label)
                        <option value="{{ $val }}">{{ $label }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-2">
                    <select id="sl-search-purpose" class="form-select form-select-sm">
                        <option value="">Any Purpose</option>
                        @foreach(\App\Models\Property::LISTING_PURPOSES as $val => $label)
                        <option value="{{ $val }}">{{ $label }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-2">
                    <input type="number" id="sl-search-min" class="form-control form-control-sm" placeholder="Min price">
                </div>
                <div class="col-md-2">
                    <input type="number" id="sl-search-max" class="form-control form-control-sm" placeholder="Max price">
                </div>
            </div>
            <div id="sl-results" class="list-group list-group-flush small" style="max-height:320px;overflow-y:auto"></div>
            <div id="sl-empty" class="text-muted text-center py-3 small d-none">No properties found.</div>
            <div id="sl-loading" class="text-muted text-center py-3 small d-none">
                <div class="spinner-border spinner-border-sm me-1"></div> Searching…
            </div>
        </div>
    </div>
    @endif

    <div class="card-body p-0">
        @if($shortlisted->isEmpty())
        <div class="text-center text-muted py-4 small">
            <i class="bi bi-bookmark d-block fs-3 mb-2 text-secondary"></i>
            No properties shortlisted yet.
        </div>
        @else
        <div class="table-responsive">
            <table class="table table-sm align-middle mb-0">
                <thead class="table-light">
                    <tr>
                        <th style="min-width:220px">Property</th>
                        <th>Type</th>
                        <th>Purpose</th>
                        <th>Area</th>
                        <th>Price</th>
                        <th>Status</th>
                        <th>Added By</th>
                        <th>Added On</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($shortlisted as $sl)
                    @if(!$sl->property)
                    <tr class="text-muted">
                        <td colspan="6" class="small fst-italic">
                            <i class="bi bi-exclamation-circle me-1"></i>Property no longer available
                        </td>
                        <td class="small">{{ optional($sl->shortlistedBy)->name ?? '—' }}</td>
                        <td class="small text-nowrap">{{ $sl->created_at->format('d M Y') }}</td>
                        <td></td>
                    </tr>
                    @else
                    @php
                        $prop         = $sl->property;
                        $purposeLabel = \App\Models\Property::LISTING_PURPOSES[$prop->listing_purpose] ?? ucwords(str_replace('_', ' ', $prop->listing_purpose));
                        $purposeCls   = $prop->listing_purpose === 'for_rent' ? 'bg-info bg-opacity-10 text-info' : 'bg-success bg-opacity-10 text-success';
                        $statusLabels = ['published' => ['bg-success', 'Published'], 'under_review' => ['bg-warning text-dark', 'Under Review'], 'unavailable' => ['bg-secondary', 'Unavailable']];
                        [$statusCls, $statusLabel] = $statusLabels[$prop->status] ?? ['bg-secondary', ucwords(str_replace('_', ' ', $prop->status))];
                        $areaStr = $prop->area ? number_format((float) $prop->area, 0) . ' ' . strtoupper($prop->area_unit ?? '') : '—';
                        $propAvail = in_array($prop->id, $propertiesWithSaleDeals) ? 'sold'
                            : (in_array($prop->id, $propertiesWithActiveRentals) ? 'rented' : 'available');
                    @endphp
                    <tr>
                        <td>
                            <div class="d-flex align-items-center gap-2">
                                {{-- Thumbnail --}}
                                <div class="flex-shrink-0" style="width:52px;height:42px;border-radius:5px;overflow:hidden;background:#f0f0f0">
                                    @if($prop->coverImage)
                                        <img src="{{ route('admin.media.image', $prop->coverImage) }}"
                                             alt="{{ $prop->title }}"
                                             style="width:100%;height:100%;object-fit:cover">
                                    @else
                                        <div class="w-100 h-100 d-flex align-items-center justify-content-center text-muted">
                                            <i class="bi bi-image" style="font-size:1.1rem"></i>
                                        </div>
                                    @endif
                                </div>
                                @if($prop->trashed())
                                <span class="fw-medium text-dark small">
                                    {{ $prop->title }}
                                    @if($prop->city)
                                    <div class="text-muted fw-normal" style="font-size:0.7rem">{{ $prop->city }}</div>
                                    @endif
                                </span>
                                @else
                                <a href="{{ route('admin.property.show', $prop) }}" class="text-decoration-none fw-medium text-dark small">
                                    {{ $prop->title }}
                                    @if($prop->city)
                                    <div class="text-muted fw-normal" style="font-size:0.7rem">{{ $prop->city }}</div>
                                    @endif
                                </a>
                                @endif
                            </div>
                        </td>
                        <td class="small text-muted text-nowrap">{{ (\App\Models\Property::typeLabels())[$prop->type] ?? $prop->type }}</td>
                        <td class="small text-nowrap">
                            <span class="badge {{ $purposeCls }}">{{ $purposeLabel }}</span>
                        </td>
                        <td class="small text-muted text-nowrap">{{ $areaStr }}</td>
                        <td class="small text-nowrap">{{ $prop->formattedPrice() }}</td>
                        <td class="small text-nowrap">
                            <span class="badge {{ $statusCls }}">{{ $statusLabel }}</span>
                            @if($propAvail === 'sold')
                                <span class="badge bg-danger ms-1">Sold</span>
                            @elseif($propAvail === 'rented')
                                <span class="badge bg-warning text-dark ms-1">Rented</span>
                            @endif
                        </td>
                        <td class="small text-muted text-nowrap">{{ optional($sl->shortlistedBy)->name ?? '—' }}</td>
                        <td class="small text-muted text-nowrap">{{ $sl->created_at->format('d M Y') }}</td>
                        <td class="text-nowrap">
                            @if(!$prop->trashed())
                            <a href="{{ route('admin.property.show', $prop) }}"
                               class="btn btn-sm btn-outline-secondary py-0 px-2 me-1"
                               title="View Property">
                                <i class="bi bi-eye"></i>
                            </a>
                            @endif
                            @if($lead->isOpen())
                            <button class="btn btn-sm btn-outline-danger py-0 px-2"
                                    data-bs-toggle="modal"
                                    data-bs-target="#removeShortlistModal"
                                    data-property-id="{{ $prop->id }}"
                                    data-property-title="{{ addslashes($prop->title) }}"
                                    title="Remove from Shortlist">
                                <i class="bi bi-x"></i>
                            </button>
                            @endif
                        </td>
                    </tr>
                    @endif
                    @endforeach
                </tbody>
            </table>
        </div>
        @endif
    </div>
</div>

{{-- Site Visits --}}
<div class="card border-0 shadow-sm mb-4" id="site-visits">
    <div class="card-header bg-white border-0 pt-3 pb-0 d-flex align-items-center justify-content-between">
        <h6 class="fw-semibold mb-0">
            <i class="bi bi-map me-2 text-primary"></i>Site Visits
            <span class="badge bg-secondary bg-opacity-10 text-secondary ms-1">{{ $siteVisits->count() }}</span>
        </h6>
        @if($lead->isOpen())
        <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#logVisitModal">
            <i class="bi bi-plus-lg me-1"></i>Log Visit
        </button>
        @endif
    </div>
    <div class="card-body p-0">
        @if($siteVisits->isEmpty())
        <div class="text-center text-muted py-4 small">
            <i class="bi bi-signpost-2 d-block fs-3 mb-2 text-secondary"></i>
            No site visits logged yet.
        </div>
        @else
        <div class="table-responsive">
            <table class="table table-sm align-middle mb-0">
                <thead class="table-light">
                    <tr>
                        <th>Property</th>
                        <th>Date &amp; Time</th>
                        <th>Stage at Visit</th>
                        <th>Accompanying Staff</th>
                        <th>Notes</th>
                        <th>Logged By</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($siteVisits as $visit)
                    <tr>
                        <td>
                            @if($visit->property && !$visit->property->trashed())
                            <a href="{{ route('admin.property.show', $visit->property) }}"
                               class="text-decoration-none fw-medium text-dark">
                                {{ $visit->property->title }}
                            </a>
                            @elseif($visit->property)
                            <span class="fw-medium text-dark">{{ $visit->property->title }}</span>
                            @else
                            <span class="text-muted small fst-italic">Property no longer available</span>
                            @endif
                        </td>
                        <td class="small text-nowrap">{{ $visit->formattedVisitDateTime() }}</td>
                        <td>
                            @if($visit->stageSnapshot)
                            <span class="badge" style="background-color:{{ $visit->stageSnapshot->color }}">
                                {{ $visit->stageSnapshot->name }}
                            </span>
                            @else
                            <span class="text-muted small">—</span>
                            @endif
                        </td>
                        <td class="small">{{ $visit->accompanying_staff }}</td>
                        <td class="small text-muted" style="max-width:220px">
                            {{ $visit->notes ?: '—' }}
                        </td>
                        <td class="small text-muted">{{ optional($visit->loggedBy)->name ?? '—' }}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        @endif
    </div>
</div>

{{-- Active Reminders for this Lead --}}
@if($pendingReminders->isNotEmpty())
<div class="card border-0 shadow-sm mb-4 border-warning border-opacity-50">
    <div class="card-header bg-warning bg-opacity-10 border-0 pt-3 pb-0 d-flex align-items-center justify-content-between">
        <h6 class="fw-semibold mb-0">
            <i class="bi bi-bell me-2 text-warning"></i>Active Reminders
            <span class="badge bg-warning text-dark ms-1">{{ $pendingReminders->count() }}</span>
        </h6>
    </div>
    <div class="card-body p-0">
        <ul class="list-group list-group-flush">
            @foreach($pendingReminders as $reminder)
            @php
                $remindAt   = $reminder->remind_at;
                $isOverdue  = $remindAt->lt(now()->startOfDay());
                $isDueToday = ! $isOverdue && $remindAt->isToday();
                // Upcoming: not overdue and not today
                if ($isOverdue) {
                    $statusBadge = '<span class="badge bg-danger bg-opacity-10 text-danger border border-danger border-opacity-25" style="font-size:0.7rem">Overdue</span>';
                    $iconClass   = 'bi-alarm-fill text-danger';
                } elseif ($isDueToday) {
                    $statusBadge = '<span class="badge bg-warning bg-opacity-10 text-warning border border-warning border-opacity-25" style="font-size:0.7rem">Due Today</span>';
                    $iconClass   = 'bi-clock-fill text-warning';
                } else {
                    $statusBadge = '<span class="badge bg-primary bg-opacity-10 text-primary border border-primary border-opacity-25" style="font-size:0.7rem">Upcoming</span>';
                    $iconClass   = 'bi-bell text-primary';
                }
            @endphp
            <li class="list-group-item px-4 py-3">
                <div class="d-flex align-items-start gap-3">
                    <i class="bi {{ $iconClass }} mt-1 flex-shrink-0"></i>
                    <div class="flex-grow-1">
                        <div class="d-flex align-items-center gap-2 mb-1">
                            <span class="small fw-medium">{{ $reminder->message }}</span>
                            {!! $statusBadge !!}
                        </div>
                        <div class="text-muted" style="font-size:0.72rem">
                            <i class="bi bi-clock me-1"></i>{{ $remindAt->format('d M Y, h:i A') }}
                            · Assigned to: {{ optional($reminder->assignedTo)->name ?? '—' }}
                        </div>
                    </div>
                    <form method="POST" action="{{ route('reminders.done', $reminder) }}" class="flex-shrink-0">
                        @csrf @method('PATCH')
                        <button type="submit" class="btn btn-sm btn-outline-success py-0 px-2">
                            <i class="bi bi-check-lg me-1"></i>Done
                        </button>
                    </form>
                </div>
            </li>
            @endforeach
        </ul>
    </div>
</div>
@endif

{{-- Quotes --}}
<div class="card border-0 shadow-sm mb-4" id="quotes">
    <div class="card-header bg-white border-0 pt-3 pb-0 d-flex align-items-center justify-content-between">
        <h6 class="fw-semibold mb-0">
            <i class="bi bi-cash-stack me-2 text-success"></i>Quotes
            <span class="badge bg-secondary bg-opacity-10 text-secondary ms-1">{{ $quotes->count() }}</span>
        </h6>
        <button class="btn btn-outline-success btn-sm" data-bs-toggle="modal" data-bs-target="#logQuoteModal">
            <i class="bi bi-plus-lg me-1"></i>Log Quote
        </button>
    </div>
    <div class="card-body p-0">
        @if($quotes->isEmpty())
        <div class="text-center text-muted py-4 small">
            <i class="bi bi-cash-stack d-block fs-3 mb-2 text-secondary"></i>
            No quotes logged yet.
        </div>
        @else
        <div class="table-responsive">
            <table class="table table-sm table-hover mb-0 align-middle">
                <thead class="table-light">
                    <tr>
                        <th class="ps-3">Property</th>
                        <th>Quoted Price</th>
                        <th>Date</th>
                        <th>Shared By</th>
                        <th>Notes</th>
                        <th class="text-muted small">Logged By</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($quotes as $quote)
                    <tr>
                        <td class="ps-3 small">{{ optional($quote->property)->title ?? '—' }}</td>
                        <td class="small fw-medium">₹ {{ number_format((float)$quote->quoted_price, 0) }}</td>
                        <td class="small">{{ $quote->quote_date ? $quote->quote_date->format('d M Y, H:i') : '—' }}</td>
                        <td class="small">{{ $quote->shared_by }}</td>
                        <td class="small text-muted">{{ $quote->notes ?: '—' }}</td>
                        <td class="small text-muted">{{ optional($quote->createdBy)->name ?? '—' }}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        @endif
    </div>
</div>

{{-- Final Deal --}}
<div class="card border-0 shadow-sm mb-4" id="final-deal">
    <div class="card-header bg-white border-0 pt-3 pb-0 d-flex align-items-center justify-content-between">
        <h6 class="fw-semibold mb-0">
            <i class="bi bi-file-earmark-check me-2 text-success"></i>Final Deal
        </h6>
        @if(! $agreement || ! $agreement->isActive() || $agreementIsExpired)
        @if($lead->isOpen())
        <button class="btn btn-success btn-sm" data-bs-toggle="modal" data-bs-target="#recordDealModal">
            <i class="bi bi-plus-lg me-1"></i>Record Deal
        </button>
        @endif
        @endif
        @if($agreement && $agreement->isActive() && ! $agreementIsExpired && auth()->user()->isAdmin())
        <button type="button"
                class="btn btn-sm btn-outline-danger"
                id="deactivateDealBtn"
                data-lead-id="{{ $lead->id }}">
            <i class="bi bi-x-circle me-1"></i>Deactivate Deal
        </button>
        @endif
    </div>
    <div class="card-body">
        @if(! $agreement || ! $agreement->isActive() || $agreementIsExpired)
        <div class="text-center text-muted py-3 small">
            <i class="bi bi-file-earmark d-block fs-3 mb-2 text-secondary"></i>
            No active deal recorded yet.
        </div>
        @else
        <div class="row g-3">
            <div class="col-md-4">
                <div class="small text-muted mb-1">Deal Type</div>
                <span class="badge {{ $agreement->isRental() ? 'bg-info' : 'bg-success' }} bg-opacity-75">
                    {{ $agreement->isRental() ? 'Rental' : 'Sale' }}
                </span>
                @if(! $agreement->isActive())
                    <span class="badge bg-secondary ms-1">Deactivated</span>
                @endif
            </div>
            <div class="col-md-4">
                <div class="small text-muted mb-1">Property</div>
                <div class="small fw-medium">{{ optional($agreement->property)->title ?? '—' }}</div>
            </div>
            <div class="col-md-4">
                <div class="small text-muted mb-1">Deal Date</div>
                <div class="small">{{ $agreement->deal_date ? $agreement->deal_date->format('d M Y') : '—' }}</div>
            </div>
            <div class="col-md-4">
                <div class="small text-muted mb-1">Client Name</div>
                <div class="small">{{ $agreement->client_name }}</div>
            </div>
            <div class="col-md-4">
                <div class="small text-muted mb-1">Owner Name</div>
                <div class="small">{{ $agreement->owner_name }}</div>
            </div>
            <div class="col-md-4">
                <div class="small text-muted mb-1">Agreed Price</div>
                <div class="small fw-medium text-success">₹ {{ number_format((float)$agreement->agreed_price, 0) }}</div>
            </div>
            @if($agreement->isRental())
            <div class="col-md-4">
                <div class="small text-muted mb-1">Agreement Period</div>
                <div class="small">
                    {{ $agreement->agreement_start_date ? $agreement->agreement_start_date->format('d M Y') : '—' }}
                    → {{ $agreement->agreement_end_date ? $agreement->agreement_end_date->format('d M Y') : '—' }}
                </div>
            </div>
            <div class="col-md-4">
                <div class="small text-muted mb-1">Monthly Rent</div>
                <div class="small fw-medium">₹ {{ number_format((float)$agreement->monthly_rent, 0) }}</div>
            </div>
            <div class="col-md-4">
                <div class="small text-muted mb-1">Escalation Clause</div>
                <div class="small">{{ $agreement->rent_escalation_clause ?: '—' }}</div>
            </div>
            <div class="col-12">
                <div class="small text-muted mb-2">Agreement Document</div>
                @if($agreement->document_path)
                    <div class="d-flex align-items-center gap-2 flex-wrap">
                        <span class="small text-muted">
                            <i class="bi bi-file-pdf text-danger me-1"></i>{{ $agreement->document_original_name ?? 'agreement.pdf' }}
                        </span>
                        <a href="{{ route('admin.leads.agreement.document', $lead) }}"
                           class="btn btn-sm btn-outline-secondary">
                            <i class="bi bi-download me-1"></i>Download
                        </a>
                        @if(auth()->user()->isAdmin() || $lead->assigned_to === auth()->id())
                        <button class="btn btn-sm btn-outline-primary" type="button"
                                data-bs-toggle="collapse" data-bs-target="#agreementUploadForm">
                            <i class="bi bi-arrow-repeat me-1"></i>Replace
                        </button>
                        @endif
                    </div>
                @else
                    <div class="d-flex align-items-center gap-2">
                        <span class="small text-muted"><i class="bi bi-file-earmark-x me-1"></i>No document uploaded</span>
                        @if(auth()->user()->isAdmin() || $lead->assigned_to === auth()->id())
                        <button class="btn btn-sm btn-outline-success" type="button"
                                data-bs-toggle="collapse" data-bs-target="#agreementUploadForm">
                            <i class="bi bi-upload me-1"></i>Upload Agreement
                        </button>
                        @endif
                    </div>
                @endif

                @if(auth()->user()->isAdmin() || $lead->assigned_to === auth()->id())
                <div class="collapse mt-2 @error('agreement_document') show @enderror" id="agreementUploadForm">
                    <form id="agreementUploadFormEl"
                          method="POST"
                          action="{{ route('admin.leads.agreement.upload-document', $lead) }}"
                          enctype="multipart/form-data"
                          class="border rounded p-3 bg-light">
                        @csrf
                        <label class="form-label small fw-medium mb-1">
                            {{ $agreement->document_path ? 'Replace Agreement Document' : 'Upload Agreement Document' }}
                            <span class="text-danger">*</span>
                        </label>
                        <input type="file" name="agreement_document" accept=".pdf"
                               class="form-control form-control-sm @error('agreement_document') is-invalid @enderror">
                        @error('agreement_document')
                        <div class="agreement-file-feedback invalid-feedback" style="display:block">{{ $message }}</div>
                        @else
                        <div class="agreement-file-feedback invalid-feedback" style="display:none"></div>
                        @enderror
                        <div class="text-muted mt-1" style="font-size:0.72rem">PDF only, max 20 MB</div>
                        <div class="d-flex gap-2 mt-2">
                            <button type="submit" id="agreementUploadBtn" class="btn btn-sm btn-success">
                                <i class="bi bi-upload me-1"></i>Upload
                            </button>
                            <button type="button" class="btn btn-sm btn-light"
                                    data-bs-toggle="collapse" data-bs-target="#agreementUploadForm">
                                Cancel
                            </button>
                        </div>
                    </form>
                </div>
                @endif
            </div>
            @endif
            @if($agreement->notes)
            <div class="col-12">
                <div class="small text-muted mb-1">Notes</div>
                <div class="small">{{ $agreement->notes }}</div>
            </div>
            @endif
            @if($agreement->correction_note)
            <div class="col-12">
                <div class="alert alert-warning py-2 mb-0 small">
                    <i class="bi bi-exclamation-triangle me-1"></i>
                    <strong>Correction Note:</strong> {{ $agreement->correction_note }}
                </div>
            </div>
            @endif
            @if(! $agreement->isActive())
            <div class="col-12">
                <div class="alert alert-secondary py-2 mb-0 small border-0">
                    <i class="bi bi-x-circle me-1"></i>
                    <strong>Deactivated</strong>
                    @if($agreement->deactivated_at)
                        on {{ $agreement->deactivated_at->format('d M Y, H:i') }}
                    @endif
                    @if($agreement->deactivatedBy)
                        by {{ $agreement->deactivatedBy->name }}
                    @endif
                    @if($agreement->deactivation_note)
                        — {{ $agreement->deactivation_note }}
                    @endif
                </div>
            </div>
            @endif
        </div>

        @if(auth()->user()->isAdmin())
        <hr class="my-3">
        <form method="POST" action="{{ route('admin.leads.agreement.correction', $lead) }}">
            @csrf
            @method('PATCH')
            <label class="form-label small fw-medium mb-1">
                <i class="bi bi-pencil-square me-1"></i>Add / Update Correction Note
            </label>
            <textarea name="correction_note" rows="2"
                      class="form-control form-control-sm @error('correction_note') is-invalid @enderror"
                      placeholder="Describe any corrections or amendments to this deal…"
                      maxlength="2000">{{ old('correction_note', $agreement->correction_note) }}</textarea>
            @error('correction_note') <div class="invalid-feedback">{{ $message }}</div> @enderror
            <div class="d-flex justify-content-end mt-2">
                <button type="submit" class="btn btn-sm btn-warning">
                    <i class="bi bi-save me-1"></i>Save Correction
                </button>
            </div>
        </form>
        @endif
        @endif
    </div>
</div>

{{-- Old Deals (Deactivated / Historical) --}}
@if($oldDeals->isNotEmpty())
<div class="card border-0 shadow-sm mb-4">
    <div class="card-header bg-white border-0 pt-3 pb-0">
        <h6 class="fw-semibold mb-0">
            <i class="bi bi-archive me-2 text-secondary"></i>Old Deals
            <span class="badge bg-secondary bg-opacity-10 text-secondary ms-1">{{ $oldDeals->count() }}</span>
        </h6>
    </div>
    <div class="card-body p-0">
        @foreach($oldDeals as $old)
        @php
            $oldBadgeCls  = $old->isRental() ? 'bg-info bg-opacity-75' : 'bg-success bg-opacity-75';
            $oldBadgeTxt  = $old->isRental() ? 'Rental' : 'Sale';
            $oldIsExpired = $old->isActive()
                && $old->isRental()
                && $old->agreement_end_date
                && $old->agreement_end_date->lt(\Carbon\Carbon::today());
        @endphp
        <div class="border-bottom px-4 py-3 {{ $loop->last ? 'border-0' : '' }}">
            <div class="d-flex align-items-start justify-content-between flex-wrap gap-2">
                <div>
                    <div class="d-flex align-items-center gap-2 flex-wrap mb-1">
                        <span class="badge {{ $oldBadgeCls }}">{{ $oldBadgeTxt }}</span>
                        @if($oldIsExpired)
                            <span class="badge bg-warning text-dark">Expired</span>
                        @else
                            <span class="badge bg-secondary">Deactivated</span>
                        @endif
                        <span class="small fw-medium">{{ optional($old->property)->title ?? '—' }}</span>
                    </div>
                    <div class="row g-3 small text-muted mt-1">
                        <div class="col-auto">
                            <span class="fw-medium text-dark">₹ {{ number_format((float)$old->agreed_price, 0) }}</span>
                        </div>
                        <div class="col-auto">
                            <i class="bi bi-calendar me-1"></i>{{ $old->deal_date ? $old->deal_date->format('d M Y') : '—' }}
                        </div>
                        @if($old->isRental() && $old->agreement_start_date && $old->agreement_end_date)
                        <div class="col-auto">
                            <i class="bi bi-arrow-left-right me-1"></i>
                            {{ $old->agreement_start_date->format('d M Y') }} → {{ $old->agreement_end_date->format('d M Y') }}
                        </div>
                        @if($old->monthly_rent)
                        <div class="col-auto">
                            <i class="bi bi-cash me-1"></i>₹ {{ number_format((float)$old->monthly_rent, 0) }}/mo
                        </div>
                        @endif
                        @endif
                        <div class="col-auto">
                            <i class="bi bi-person me-1"></i>Recorded by {{ optional($old->createdBy)->name ?? '—' }}
                        </div>
                    </div>
                    @if($oldIsExpired)
                    <div class="small text-muted mt-1">
                        <i class="bi bi-clock me-1 text-warning"></i>
                        Agreement expired on {{ $old->agreement_end_date->format('d M Y') }}
                    </div>
                    @elseif($old->deactivated_at)
                    <div class="small text-muted mt-1">
                        <i class="bi bi-x-circle me-1 text-secondary"></i>
                        Deactivated {{ $old->deactivated_at->format('d M Y, H:i') }}
                        @if($old->deactivatedBy) by {{ $old->deactivatedBy->name }} @endif
                        @if($old->deactivation_note)
                            &mdash; {{ $old->deactivation_note }}
                        @endif
                    </div>
                    @endif
                </div>
                @if($old->document_path && $old->lead)
                <a href="{{ route('admin.leads.agreement.document', $old->lead) }}"
                   class="btn btn-sm btn-outline-secondary flex-shrink-0">
                    <i class="bi bi-file-pdf me-1"></i>Agreement
                </a>
                @endif
            </div>
        </div>
        @endforeach
    </div>
</div>
@endif

{{-- Activity Log --}}
<div class="card border-0 shadow-sm mb-4">
    <div class="card-header bg-white border-0 pt-3 pb-0">
        <h6 class="fw-semibold mb-0">
            <i class="bi bi-journal-text me-2 text-primary"></i>Activity Log
        </h6>
    </div>
    <div class="card-body p-0">
        @if($lead->activityLogs->isEmpty())
        <div class="text-center text-muted py-4 small">
            <i class="bi bi-clock-history d-block fs-3 mb-2 text-secondary"></i>
            No activity recorded yet.
        </div>
        @else
        <ul class="list-group list-group-flush">
            @foreach($lead->activityLogs as $log)
            @php
                $iconMap = [
                    'shortlist_added'    => 'bi-bookmark-plus text-success',
                    'shortlist_removed'  => 'bi-bookmark-x text-danger',
                    'stage_changed'      => 'bi-arrow-right-circle text-primary',
                    'lead_created'       => 'bi-plus-circle text-info',
                    'site_visit_logged'  => 'bi-map text-info',
                    'note_added'         => 'bi-chat-left-text text-secondary',
                    'reminder_created'   => 'bi-bell text-warning',
                    'quote_logged'       => 'bi-cash-stack text-success',
                    'agreement_created'      => 'bi-file-earmark-check text-success',
                    'agreement_deactivated'  => 'bi-x-circle text-secondary',
                ];
                $icon = $iconMap[$log->action] ?? 'bi-circle text-secondary';
            @endphp
            <li class="list-group-item px-3 py-2">
                <div class="d-flex align-items-start gap-2">
                    <i class="bi {{ $icon }} mt-1" style="font-size:0.9rem;flex-shrink:0"></i>
                    <div class="flex-grow-1">
                        <div class="small">{{ $log->description }}</div>
                        <div class="text-muted" style="font-size:0.7rem">
                            {{ optional($log->performedBy)->name ?? 'System' }}
                            · {{ $log->created_at->format('d M Y, h:i A') }}
                        </div>
                    </div>
                </div>
            </li>
            @endforeach
        </ul>
        @endif
    </div>

    {{-- Add Note form --}}
    <div class="card-footer bg-light border-top py-3">
        <form method="POST" action="{{ route('admin.leads.notes.store', $lead) }}">
            @csrf
            <label class="form-label small fw-medium mb-1">
                <i class="bi bi-chat-left-text me-1"></i>Add Note
            </label>
            <textarea name="note" rows="2"
                      class="form-control form-control-sm @error('note') is-invalid @enderror"
                      placeholder="Type a note about this lead… (max 2000 characters)"
                      maxlength="2000">{{ old('note') }}</textarea>
            @error('note') <div class="invalid-feedback">{{ $message }}</div> @enderror
            <div class="d-flex justify-content-end mt-2">
                <button type="submit" class="btn btn-sm btn-primary">
                    <i class="bi bi-plus-lg me-1"></i>Add Note
                </button>
            </div>
        </form>
    </div>
</div>

@if($lead->isOpen())
{{-- Log Visit Modal --}}
<div class="modal fade" id="logVisitModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <form method="POST" action="{{ route('admin.leads.visits.store', $lead) }}">
            @csrf
            <div class="modal-content border-0 shadow">
                <div class="modal-header border-0">
                    <h6 class="modal-title fw-semibold"><i class="bi bi-map me-2"></i>Log Site Visit</h6>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">

                    {{-- Property selector --}}
                    <div class="mb-3">
                        <label class="form-label fw-medium">Property <span class="text-danger">*</span></label>
                        <select name="property_id" id="visit-property-select"
                                class="form-select @error('property_id') is-invalid @enderror" required>
                            <option value="">— Select a property —</option>
                            @if($shortlisted->isNotEmpty())
                            <optgroup label="Shortlisted Properties">
                                @foreach($shortlisted as $sl)
                                @if($sl->property)
                                @php
                                    $visitPropId = $sl->property->id;
                                    $visitAvail  = in_array($visitPropId, $propertiesWithSaleDeals) ? 'sold'
                                        : (in_array($visitPropId, $propertiesWithActiveRentals) ? 'rented' : 'available');
                                    $visitSuffix = $visitAvail === 'sold' ? ' [Sold]' : ($visitAvail === 'rented' ? ' [Rented]' : '');
                                @endphp
                                <option value="{{ $visitPropId }}"
                                        {{ old('property_id') == $visitPropId ? 'selected' : '' }}>
                                    {{ $sl->property->title }}{{ $visitSuffix }}
                                    {{ $sl->property->city ? '(' . $sl->property->city . ')' : '' }}
                                </option>
                                @endif
                                @endforeach
                            </optgroup>
                            @endif
                            <optgroup label="Search any property" id="visit-search-group" style="display:none">
                            </optgroup>
                        </select>
                        @error('property_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        <div class="mt-2">
                            <input type="text" id="visit-property-search" class="form-control form-control-sm"
                                   placeholder="Or type to search any published property…">
                            <div id="visit-search-results" class="list-group mt-1 small" style="max-height:180px;overflow-y:auto"></div>
                        </div>
                    </div>

                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Visit Date <span class="text-danger">*</span></label>
                            <input type="date" name="visit_date"
                                   class="form-control @error('visit_date') is-invalid @enderror"
                                   value="{{ old('visit_date', date('Y-m-d')) }}"
                                   max="{{ date('Y-m-d') }}" required>
                            @error('visit_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Visit Time <span class="text-danger">*</span></label>
                            <input type="time" name="visit_time"
                                   class="form-control @error('visit_time') is-invalid @enderror"
                                   value="{{ old('visit_time', date('H:i')) }}" required>
                            @error('visit_time') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>

                    <div class="mb-3 mt-3">
                        <label class="form-label fw-medium">Accompanying Staff <span class="text-danger">*</span></label>
                        <input type="text" name="accompanying_staff"
                               class="form-control @error('accompanying_staff') is-invalid @enderror"
                               value="{{ old('accompanying_staff') }}"
                               placeholder="e.g. Ramesh Kumar, Sita Patel"
                               required maxlength="500">
                        <div class="form-text">Names of all staff who accompanied the client, comma-separated.</div>
                        @error('accompanying_staff') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>

                    <div class="mb-1">
                        <label class="form-label fw-medium">Notes / Outcome <span class="text-muted fw-normal">(optional)</span></label>
                        <textarea name="notes" rows="3"
                                  class="form-control @error('notes') is-invalid @enderror"
                                  placeholder="Client feedback, objections raised, agreed next steps…"
                                  maxlength="2000">{{ old('notes') }}</textarea>
                        @error('notes') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>

                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary">
                        <i class="bi bi-check-lg me-1"></i>Log Visit
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>
@endif

{{-- Create Reminder Modal --}}
<div class="modal fade" id="createReminderModal" tabindex="-1">
    <div class="modal-dialog">
        <form method="POST" action="{{ route('admin.leads.reminders.store', $lead) }}">
            @csrf
            <div class="modal-content border-0 shadow">
                <div class="modal-header border-0">
                    <h6 class="modal-title fw-semibold"><i class="bi bi-bell-plus me-2"></i>Set Reminder</h6>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">

                    <div class="mb-3">
                        <label class="form-label fw-medium">Reminder Message <span class="text-danger">*</span></label>
                        <textarea name="message" rows="3"
                                  class="form-control @error('message') is-invalid @enderror"
                                  placeholder="e.g. Call back after meeting, Follow up on site visit…"
                                  maxlength="500" required>{{ old('message') }}</textarea>
                        @error('message') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        <div class="form-text">Max 500 characters.</div>
                    </div>

                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Reminder Date <span class="text-danger">*</span></label>
                            <input type="date" name="remind_date"
                                   class="form-control @error('remind_date') is-invalid @enderror"
                                   value="{{ old('remind_date', date('Y-m-d')) }}"
                                   min="{{ date('Y-m-d') }}" required>
                            @error('remind_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Reminder Time <span class="text-danger">*</span></label>
                            <input type="time" name="remind_time"
                                   class="form-control @error('remind_time') is-invalid @enderror"
                                   value="{{ old('remind_time', date('H:i')) }}" required>
                            @error('remind_time') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>

                    @if(auth()->user()->isAdmin())
                    <div class="mt-3">
                        <label class="form-label fw-medium">Assign To <span class="text-danger">*</span></label>
                        <select name="assigned_to"
                                class="form-select @error('assigned_to') is-invalid @enderror" required>
                            <option value="">— Select staff —</option>
                            @foreach($staffList as $staff)
                            <option value="{{ $staff->id }}"
                                    {{ old('assigned_to', $lead->assigned_to) == $staff->id ? 'selected' : '' }}>
                                {{ $staff->name }} ({{ ucfirst($staff->role) }})
                            </option>
                            @endforeach
                        </select>
                        @error('assigned_to') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>
                    @else
                    <input type="hidden" name="assigned_to" value="{{ $lead->assigned_to }}">
                    @endif

                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-warning text-dark">
                        <i class="bi bi-bell-plus me-1"></i>Set Reminder
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

@if($lead->isOpen())
{{-- Change Stage Modal --}}
<div class="modal fade" id="changeStageModal" tabindex="-1">
    <div class="modal-dialog">
        <form method="POST" action="{{ route('admin.leads.updateStage', $lead) }}">
            @csrf @method('PATCH')
            <div class="modal-content border-0 shadow">
                <div class="modal-header border-0">
                    <h6 class="modal-title fw-semibold">Change Lead Stage</h6>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="mb-3">
                        <div class="text-muted small mb-1">Current Stage</div>
                        @if($lead->currentStage)
                            <span class="badge" style="background-color: {{ $lead->currentStage->color }}; font-size:0.85rem">
                                {{ $lead->currentStage->name }}
                            </span>
                        @else
                            <span class="text-muted">—</span>
                        @endif
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-medium">New Stage <span class="text-danger">*</span></label>
                        <select name="stage_id"
                                class="form-select @error('stage_id') is-invalid @enderror" required>
                            <option value="">— Select a stage —</option>
                            @foreach($stages as $stage)
                                @if($stage->id !== $lead->current_stage_id)
                                <option value="{{ $stage->id }}"
                                        {{ old('stage_id') == $stage->id ? 'selected' : '' }}>
                                    {{ $stage->name }}
                                    @if($stage->isClosedStage()) (Closes Lead) @endif
                                </option>
                                @endif
                            @endforeach
                        </select>
                        @error('stage_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>

                    <div class="mb-1">
                        <label class="form-label fw-medium">Note / Reason <span class="text-danger">*</span></label>
                        <textarea name="note" rows="3"
                                  class="form-control @error('note') is-invalid @enderror"
                                  placeholder="Describe what happened or why the stage is changing…"
                                  required maxlength="1000">{{ old('note') }}</textarea>
                        @error('note') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        <div class="text-muted mt-1" style="font-size:0.72rem">Required — recorded in stage history.</div>
                    </div>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary">Update Stage</button>
                </div>
            </div>
        </form>
    </div>
</div>
@endif

@if($lead->isOpen())
{{-- Remove from Shortlist Modal --}}
<div class="modal fade" id="removeShortlistModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content border-0 shadow">
            <div class="modal-header border-0 pb-0">
                <h6 class="modal-title fw-semibold">Remove from Shortlist</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form id="removeShortlistForm" method="POST" action="">
                @csrf @method('DELETE')
                <div class="modal-body pt-2">
                    <p class="text-muted small mb-3">Removing: <strong id="removePropertyTitle"></strong></p>
                    <div class="mb-3">
                        <label class="form-label fw-medium">Reason <span class="text-danger">*</span></label>
                        <select name="reason" class="form-select" required>
                            <option value="">— Select reason —</option>
                            @foreach($removalReasons as $val => $label)
                            <option value="{{ $val }}">{{ $label }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div>
                        <label class="form-label fw-medium">Notes (optional)</label>
                        <textarea name="notes" rows="2" class="form-control"
                                  placeholder="Any additional context…"></textarea>
                    </div>
                </div>
                <div class="modal-footer border-0 pt-0">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-danger">Remove</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endif

{{-- Log Quote Modal --}}
<div class="modal fade" id="logQuoteModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <form method="POST" action="{{ route('admin.leads.quotes.store', $lead) }}">
            @csrf
            <div class="modal-content border-0 shadow">
                <div class="modal-header border-0">
                    <h6 class="modal-title fw-semibold"><i class="bi bi-cash-stack me-2"></i>Log Quote</h6>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">

                    <div class="mb-3">
                        <label class="form-label fw-medium">Property <span class="text-danger">*</span></label>
                        <select name="property_id"
                                class="form-select @error('property_id') is-invalid @enderror" required>
                            <option value="">— Select a property —</option>
                            @if($shortlisted->isNotEmpty())
                            <optgroup label="Shortlisted Properties">
                                @foreach($shortlisted as $sl)
                                @if($sl->property)
                                @php
                                    $quotePropId  = $sl->property->id;
                                    $quoteAvail   = in_array($quotePropId, $propertiesWithSaleDeals) ? 'sold'
                                        : (in_array($quotePropId, $propertiesWithActiveRentals) ? 'rented' : 'available');
                                    $quoteSuffix  = $quoteAvail === 'sold' ? ' [Sold]' : ($quoteAvail === 'rented' ? ' [Rented]' : '');
                                @endphp
                                <option value="{{ $quotePropId }}"
                                        {{ old('property_id') == $quotePropId ? 'selected' : '' }}>
                                    {{ $sl->property->title }}{{ $quoteSuffix }}
                                </option>
                                @endif
                                @endforeach
                            </optgroup>
                            @endif
                        </select>
                        @error('property_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>

                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Quoted Price (₹) <span class="text-danger">*</span></label>
                            <input type="number" name="quoted_price" min="1" step="1"
                                   class="form-control @error('quoted_price') is-invalid @enderror"
                                   value="{{ old('quoted_price') }}" required>
                            @error('quoted_price') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Quote Date &amp; Time <span class="text-danger">*</span></label>
                            <input type="datetime-local" name="quote_date" id="quoteDate"
                                   class="form-control @error('quote_date') is-invalid @enderror"
                                   value="{{ old('quote_date') }}" required>
                            @error('quote_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-medium">Shared By <span class="text-danger">*</span></label>
                            <input type="text" name="shared_by" maxlength="255"
                                   class="form-control @error('shared_by') is-invalid @enderror"
                                   value="{{ old('shared_by', auth()->user()->name) }}"
                                   placeholder="Agent name or channel" required>
                            @error('shared_by') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-medium">Notes (optional)</label>
                            <textarea name="notes" rows="2" maxlength="2000"
                                      class="form-control @error('notes') is-invalid @enderror"
                                      placeholder="Any additional context…">{{ old('notes') }}</textarea>
                            @error('notes') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>

                </div>
                <div class="modal-footer border-0 pt-0">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-success">
                        <i class="bi bi-check-lg me-1"></i>Log Quote
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

@if(! $agreement || ! $agreement->isActive() || $agreementIsExpired)
{{-- Record Deal Modal --}}
<div class="modal fade" id="recordDealModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <form method="POST" action="{{ route('admin.leads.agreement.store', $lead) }}"
              enctype="multipart/form-data" id="recordDealForm">
            @csrf
            <div class="modal-content border-0 shadow">
                <div class="modal-header border-0">
                    <h6 class="modal-title fw-semibold"><i class="bi bi-file-earmark-check me-2"></i>Record Final Deal</h6>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">

                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Property <span class="text-danger">*</span></label>
                            <select name="property_id" id="dealPropertySelect"
                                    class="form-select @error('property_id') is-invalid @enderror" required>
                                <option value="">— Select a property —</option>
                                @if($shortlisted->isNotEmpty())
                                <optgroup label="Shortlisted Properties">
                                    @foreach($shortlisted as $sl)
                                    @if($sl->property)
                                    @php
                                        $dealPropId = $sl->property->id;
                                        $dealAvail  = in_array($dealPropId, $propertiesWithSaleDeals) ? 'sold'
                                            : (in_array($dealPropId, $propertiesWithActiveRentals) ? 'rented' : 'available');
                                        $dealSuffix = $dealAvail === 'sold' ? ' [Sold]' : ($dealAvail === 'rented' ? ' [Rented]' : '');
                                    @endphp
                                    <option value="{{ $dealPropId }}"
                                            data-owner-name="{{ optional($sl->property->owner)->name ?? '' }}"
                                            data-listing-purpose="{{ $sl->property->listing_purpose }}"
                                            data-availability="{{ $dealAvail }}"
                                            {{ old('property_id') == $dealPropId ? 'selected' : '' }}>
                                        {{ $sl->property->title }}{{ $dealSuffix }}
                                    </option>
                                    @endif
                                    @endforeach
                                </optgroup>
                                @endif
                            </select>
                            @error('property_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Deal Type <span class="text-danger">*</span></label>
                            <select name="deal_type" id="dealTypeSelect"
                                    class="form-select @error('deal_type') is-invalid @enderror" required>
                                <option value="sale" {{ (old('deal_type', $defaultDealType) === 'sale') ? 'selected' : '' }}>Sale</option>
                                <option value="rental" {{ (old('deal_type', $defaultDealType) === 'rental') ? 'selected' : '' }}>Rental</option>
                            </select>
                            @error('deal_type') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Client Name</label>
                            <input type="text" name="client_name" maxlength="255"
                                   class="form-control bg-light @error('client_name') is-invalid @enderror"
                                   value="{{ old('client_name', optional($client)->full_name) }}"
                                   readonly required>
                            @error('client_name') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Owner Name</label>
                            <input type="text" name="owner_name" id="dealOwnerName" maxlength="255"
                                   class="form-control bg-light @error('owner_name') is-invalid @enderror"
                                   value="{{ old('owner_name') }}"
                                   readonly placeholder="Auto-filled from selected property">
                            @error('owner_name') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Agreed Price (₹) <span class="text-danger">*</span></label>
                            <input type="number" name="agreed_price" min="1" step="1"
                                   class="form-control @error('agreed_price') is-invalid @enderror"
                                   value="{{ old('agreed_price') }}" required>
                            @error('agreed_price') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-medium">Deal Date <span class="text-danger">*</span></label>
                            <input type="date" name="deal_date"
                                   class="form-control @error('deal_date') is-invalid @enderror"
                                   value="{{ old('deal_date', date('Y-m-d')) }}" required>
                            @error('deal_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-medium">Notes (optional)</label>
                            <textarea name="notes" rows="2" maxlength="2000"
                                      class="form-control @error('notes') is-invalid @enderror"
                                      placeholder="Any additional context…">{{ old('notes') }}</textarea>
                            @error('notes') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        </div>
                    </div>

                    {{-- Rental-only fields --}}
                    <div id="rentalFields" class="{{ old('deal_type', $defaultDealType) === 'rental' ? '' : 'd-none' }} mt-3 pt-3 border-top">
                        <h6 class="fw-semibold text-info mb-3"><i class="bi bi-house-door me-2"></i>Rental Details</h6>
                        <div class="row g-3">
                            <div class="col-md-6">
                                <label class="form-label fw-medium">Agreement Start Date <span class="text-danger">*</span></label>
                                <input type="date" name="agreement_start_date"
                                       class="form-control @error('agreement_start_date') is-invalid @enderror"
                                       value="{{ old('agreement_start_date') }}">
                                @error('agreement_start_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-medium">Agreement End Date <span class="text-danger">*</span></label>
                                <input type="date" name="agreement_end_date"
                                       class="form-control @error('agreement_end_date') is-invalid @enderror"
                                       value="{{ old('agreement_end_date') }}">
                                @error('agreement_end_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-medium">Monthly Rent (₹) <span class="text-danger">*</span></label>
                                <input type="number" name="monthly_rent" min="1" step="1"
                                       class="form-control @error('monthly_rent') is-invalid @enderror"
                                       value="{{ old('monthly_rent') }}">
                                @error('monthly_rent') <div class="invalid-feedback">{{ $message }}</div> @enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-medium">Expiry Reminder (days before) <span class="text-danger">*</span></label>
                                <input type="number" name="expiry_reminder_days" min="1" max="365"
                                       class="form-control @error('expiry_reminder_days') is-invalid @enderror"
                                       value="{{ old('expiry_reminder_days', $defaultReminderDays) }}">
                                @error('expiry_reminder_days') <div class="invalid-feedback">{{ $message }}</div> @enderror
                            </div>
                            <div class="col-12">
                                <label class="form-label fw-medium">Rent Escalation Clause (optional)</label>
                                <textarea name="rent_escalation_clause" rows="2" maxlength="500"
                                          class="form-control @error('rent_escalation_clause') is-invalid @enderror"
                                          placeholder="e.g. 5% annual increase…">{{ old('rent_escalation_clause') }}</textarea>
                                @error('rent_escalation_clause') <div class="invalid-feedback">{{ $message }}</div> @enderror
                            </div>
                            <div class="col-12">
                                <label class="form-label fw-medium">Agreement Document (PDF, max 20 MB) <span class="text-muted small fw-normal">(optional)</span></label>
                                <input type="file" name="agreement_document" accept=".pdf"
                                       class="form-control @error('agreement_document') is-invalid @enderror">
                                @error('agreement_document') <div class="invalid-feedback">{{ $message }}</div> @enderror
                            </div>
                        </div>
                    </div>

                </div>
                <input type="hidden" name="update_property_listing" id="dealUpdatePropertyListing" value="">
                <div class="modal-footer border-0 pt-0">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-success">
                        <i class="bi bi-check-lg me-1"></i>Record Deal
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>
@endif

@endsection

@push('scripts')
<script>
(function () {
    @if($errors->any())
        var modal = new bootstrap.Modal(document.getElementById('changeStageModal'));
        modal.show();
    @endif

    // Re-open Log Visit modal on validation error
    @if($errors->any() && old('visit_date'))
        var logVisitModal = new bootstrap.Modal(document.getElementById('logVisitModal'));
        logVisitModal.show();
    @endif

    // Re-open Reminder modal on validation error
    @if($errors->any() && old('message') && !old('visit_date') && !old('note'))
        var reminderModal = new bootstrap.Modal(document.getElementById('createReminderModal'));
        reminderModal.show();
    @endif

    // Re-open Log Quote modal on validation error
    @if($errors->any() && old('quoted_price'))
        var logQuoteModal = new bootstrap.Modal(document.getElementById('logQuoteModal'));
        logQuoteModal.show();
    @endif

    // Auto-fill Quote Date & Time with current datetime when modal opens fresh
    document.getElementById('logQuoteModal').addEventListener('show.bs.modal', function () {
        var quoteDateInput = document.getElementById('quoteDate');
        if (!quoteDateInput.value) {
            var now = new Date();
            var pad = function (n) { return String(n).padStart(2, '0'); };
            quoteDateInput.value = now.getFullYear() + '-' + pad(now.getMonth() + 1) + '-' + pad(now.getDate())
                + 'T' + pad(now.getHours()) + ':' + pad(now.getMinutes());
        }
    });

    // Re-open Record Deal modal on validation error
    @if($errors->any() && old('agreed_price'))
        var recordDealModalEl = document.getElementById('recordDealModal');
        if (recordDealModalEl) {
            var recordDealModal = new bootstrap.Modal(recordDealModalEl);
            recordDealModal.show();
        }
    @endif

    // Deal type toggle — show/hide rental fields
    var dealTypeSelect = document.getElementById('dealTypeSelect');
    var rentalFields   = document.getElementById('rentalFields');

    if (dealTypeSelect && rentalFields) {
        dealTypeSelect.addEventListener('change', function () {
            if (this.value === 'rental') {
                rentalFields.classList.remove('d-none');
            } else {
                rentalFields.classList.add('d-none');
            }
        });
    }

    // Deal modal — auto-fill Owner Name from selected property
    var dealPropertySelect = document.getElementById('dealPropertySelect');
    var dealOwnerNameInput = document.getElementById('dealOwnerName');

    function syncDealOwnerName() {
        if (! dealPropertySelect || ! dealOwnerNameInput) return;
        var opt = dealPropertySelect.options[dealPropertySelect.selectedIndex];
        dealOwnerNameInput.value = (opt && opt.dataset.ownerName) ? opt.dataset.ownerName : '';
    }

    if (dealPropertySelect) {
        dealPropertySelect.addEventListener('change', syncDealOwnerName);
        syncDealOwnerName(); // populate on page load when old('property_id') is set
    }

    // Deal modal — confirmation popups (see case matrix in code comments)
    var propertiesWithActiveRentals = @json($propertiesWithActiveRentals);
    var propertiesForSale           = @json($propertiesForSale);
    var recordDealForm              = document.getElementById('recordDealForm');
    var dealUpdatePropertyListing   = document.getElementById('dealUpdatePropertyListing');
    var isAdmin                     = @json(auth()->user()->isAdmin());

    if (recordDealForm) {
        recordDealForm.addEventListener('submit', function (e) {
            var dealType   = dealTypeSelect ? dealTypeSelect.value : '';
            var propertyId = dealPropertySelect ? parseInt(dealPropertySelect.value, 10) : 0;

            // Only intercept rental deals
            if (dealType !== 'rental' || ! propertyId) { return; }

            var hasActiveRental = propertiesWithActiveRentals.indexOf(propertyId) !== -1;
            var isSaleProperty  = propertiesForSale.indexOf(propertyId) !== -1;

            // Case I: no active rental + for_rent → submit directly, no popups
            if (! hasActiveRental && ! isSaleProperty) { return; }

            e.preventDefault();

            // Shared: property-type informational popup (Cases III & IV)
            function showPropertyTypePopup() {
                if (isAdmin) {
                    // Admin: offer to update the property listing type
                    Swal.fire({
                        title: 'Property Listed as For Sale',
                        text: 'The selected property is currently marked as a Sale property. Would you like to update the property listing type to Rental?',
                        icon: 'info',
                        showCancelButton: true,
                        confirmButtonText: 'Yes, Update Property Type',
                        cancelButtonText: 'No, Continue Without Changes',
                        confirmButtonColor: '#198754',
                        cancelButtonColor: '#6c757d',
                    }).then(function (result) {
                        if (dealUpdatePropertyListing) {
                            dealUpdatePropertyListing.value = result.isConfirmed ? '1' : '';
                        }
                        recordDealForm.submit();
                    });
                } else {
                    // Staff: informational only — submit without updating listing type
                    Swal.fire({
                        title: 'Property Listed as For Sale',
                        text: 'The selected property is currently marked as a Sale property. The deal will be recorded without changing the property listing type.',
                        icon: 'info',
                        showCancelButton: false,
                        confirmButtonText: 'OK',
                        confirmButtonColor: '#198754',
                    }).then(function () {
                        recordDealForm.submit();
                    });
                }
            }

            if (hasActiveRental) {
                // Cases II & III: active rental popup always appears first
                Swal.fire({
                    title: 'Active Rental Agreement Exists',
                    text: 'An active rental agreement already exists for this property. Do you still want to continue with this rental deal?',
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonText: 'Yes, proceed',
                    cancelButtonText: 'No, cancel',
                    confirmButtonColor: '#198754',
                }).then(function (result) {
                    if (! result.isConfirmed) { return; } // No → cancel entirely

                    if (isSaleProperty) {
                        // Case III: active rental + for_sale → chain into property-type popup
                        showPropertyTypePopup();
                    } else {
                        // Case II: active rental + for_rent → submit directly
                        recordDealForm.submit();
                    }
                });
            } else {
                // Case IV: no active rental + for_sale → property-type popup only
                showPropertyTypePopup();
            }
        });
    }

    // Log Visit — property search
    var visitSearchUrl = '{{ route("admin.leads.shortlist.search", $lead) }}';
    var visitSearchTimer = null;
    var visitSearchInput = document.getElementById('visit-property-search');

    if (visitSearchInput) {
        visitSearchInput.addEventListener('input', function () {
            clearTimeout(visitSearchTimer);
            var q = this.value.trim();
            var resultsEl = document.getElementById('visit-search-results');

            if (q.length < 2) {
                resultsEl.innerHTML = '';
                return;
            }

            visitSearchTimer = setTimeout(function () {
                fetch('{{ route("admin.ajax.properties.search") }}?q=' + encodeURIComponent(q), {
                    headers: { 'X-Requested-With': 'XMLHttpRequest' }
                })
                .then(function(r) { return r.json(); })
                .then(function(data) {
                    var results = data.results || [];
                    var html = '';
                    results.forEach(function(p) {
                        var availBadge = '';
                        if (p.availability_status === 'sold') {
                            availBadge = ' <span class="badge bg-danger" style="font-size:0.6rem">Sold</span>';
                        } else if (p.availability_status === 'rented') {
                            availBadge = ' <span class="badge bg-warning text-dark" style="font-size:0.6rem">Rented</span>';
                        }
                        html += '<button type="button" class="list-group-item list-group-item-action py-1 small"'
                            + ' onclick="selectVisitProperty(' + p.id + ', \'' + p.title.replace(/'/g, "\\'") + '\')">'
                            + p.title + availBadge + (p.city ? ' <span class=\'text-muted\'>· ' + p.city + '</span>' : '')
                            + '</button>';
                    });
                    resultsEl.innerHTML = html || '<div class="list-group-item text-muted py-1">No results found.</div>';
                })
                .catch(function() { resultsEl.innerHTML = ''; });
            }, 300);
        });
    }

    window.selectVisitProperty = function(id, title) {
        var select = document.getElementById('visit-property-select');
        // Check if option already exists
        var existing = select.querySelector('option[value="' + id + '"]');
        if (!existing) {
            var opt = document.createElement('option');
            opt.value = id;
            opt.textContent = title;
            select.appendChild(opt);
        }
        select.value = id;
        document.getElementById('visit-property-search').value = '';
        document.getElementById('visit-search-results').innerHTML = '';
    };

    // Remove shortlist modal: wire property_id into form action
    var removeModal = document.getElementById('removeShortlistModal');
    if (removeModal) {
        removeModal.addEventListener('show.bs.modal', function (e) {
            var btn = e.relatedTarget;
            var propertyId = btn.dataset.propertyId;
            var title = btn.dataset.propertyTitle;
            document.getElementById('removePropertyTitle').textContent = title;
            document.getElementById('removeShortlistForm').action =
                '{{ route("admin.leads.shortlist.destroy", [$lead, "__PROP__"]) }}'.replace('__PROP__', propertyId);
        });
    }

    // Property search
    var searchUrl = '{{ route("admin.leads.shortlist.search", $lead) }}';
    var addUrl    = '{{ route("admin.leads.shortlist.store", $lead) }}';
    var csrfToken = '{{ csrf_token() }}';

    var searchTimer = null;
    var fields = ['sl-search-q','sl-search-type','sl-search-purpose','sl-search-min','sl-search-max'];

    function doSearch() {
        var params = new URLSearchParams();
        params.set('q',               document.getElementById('sl-search-q').value);
        params.set('type',            document.getElementById('sl-search-type').value);
        params.set('listing_purpose', document.getElementById('sl-search-purpose').value);
        params.set('min_price',       document.getElementById('sl-search-min').value);
        params.set('max_price',       document.getElementById('sl-search-max').value);

        var q = document.getElementById('sl-search-q').value;
        if (q.length < 2 && !params.get('type') && !params.get('listing_purpose')) {
            document.getElementById('sl-results').innerHTML = '';
            document.getElementById('sl-empty').classList.add('d-none');
            return;
        }

        document.getElementById('sl-loading').classList.remove('d-none');
        document.getElementById('sl-empty').classList.add('d-none');
        document.getElementById('sl-results').innerHTML = '';

        fetch(searchUrl + '?' + params.toString(), {
            headers: { 'X-Requested-With': 'XMLHttpRequest' }
        })
        .then(function(r) { return r.json(); })
        .then(function(data) {
            document.getElementById('sl-loading').classList.add('d-none');
            var results = data.results || [];
            if (results.length === 0) {
                document.getElementById('sl-empty').classList.remove('d-none');
                return;
            }
            var html = '';
            results.forEach(function(p) {
                html += '<div class="list-group-item list-group-item-action property-search-result d-flex align-items-center gap-3 py-2">';
                if (p.cover_image) {
                    html += '<img src="' + p.cover_image + '" style="width:48px;height:36px;object-fit:cover;border-radius:4px" alt="">';
                } else {
                    html += '<div style="width:48px;height:36px;background:#f0f0f0;border-radius:4px;display:flex;align-items:center;justify-content:center"><i class="bi bi-building text-secondary"></i></div>';
                }
                html += '<div class="flex-grow-1 min-width-0">';
                html += '<div class="fw-medium text-truncate small">' + p.title;
                if (p.availability_status === 'sold') {
                    html += ' <span class="badge bg-danger" style="font-size:0.65rem">Sold</span>';
                } else if (p.availability_status === 'rented') {
                    html += ' <span class="badge bg-warning text-dark" style="font-size:0.65rem">Rented</span>';
                }
                html += '</div>';
                html += '<div class="text-muted" style="font-size:0.7rem">' + (p.type || '') + (p.listing_purpose ? ' · ' + p.listing_purpose : '') + (p.city ? ' · ' + p.city : '') + '</div>';
                html += '</div>';
                html += '<div class="text-end flex-shrink-0">';
                html += '<div class="small fw-medium">' + (p.price || '') + '</div>';
                html += '<button type="button" class="btn btn-sm btn-primary py-0 px-2 mt-1" onclick="addToShortlist(' + p.id + ', this)">';
                html += '<i class="bi bi-bookmark-plus me-1"></i>Shortlist</button>';
                html += '</div></div>';
            });
            document.getElementById('sl-results').innerHTML = html;
        })
        .catch(function() {
            document.getElementById('sl-loading').classList.add('d-none');
        });
    }

    fields.forEach(function(id) {
        var el = document.getElementById(id);
        if (!el) return;
        el.addEventListener('input', function() {
            clearTimeout(searchTimer);
            searchTimer = setTimeout(doSearch, 300);
        });
        el.addEventListener('change', function() {
            clearTimeout(searchTimer);
            doSearch();
        });
    });

    window.addToShortlist = function(propertyId, btn) {
        btn.disabled = true;
        btn.innerHTML = '<span class="spinner-border spinner-border-sm"></span>';

        fetch(addUrl, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-CSRF-TOKEN': csrfToken,
                'Accept': 'application/json',
                'X-Requested-With': 'XMLHttpRequest'
            },
            body: JSON.stringify({ property_id: propertyId })
        })
        .then(function(r) {
            return r.json().then(function(data) {
                if (data.status) {
                    window.location.reload();
                } else {
                    btn.disabled = false;
                    btn.innerHTML = '<i class="bi bi-bookmark-plus me-1"></i>Shortlist';
                    Swal.fire({ icon: 'error', title: 'Error', text: data.message || 'Could not shortlist property.' });
                }
            });
        })
        .catch(function() {
            btn.disabled = false;
            btn.innerHTML = '<i class="bi bi-bookmark-plus me-1"></i>Shortlist';
        });
    };
}());

// Deactivate Deal — SweetAlert2 confirmation
@if($agreement && $agreement->isActive() && auth()->user()->isAdmin())
(function () {
    var btn = document.getElementById('deactivateDealBtn');
    if (! btn) return;

    btn.addEventListener('click', function () {
        Swal.fire({
            title: 'Deactivate Deal?',
            html: 'This will mark the deal as <strong>inactive</strong> and make the property available for new deals again.<br><br>' +
                  '<input id="swal-deactivation-note" class="swal2-input" placeholder="Reason / note (optional)" maxlength="1000">',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Yes, Deactivate Deal',
            cancelButtonText: 'Cancel',
            confirmButtonColor: '#dc3545',
            focusCancel: true,
            preConfirm: function () {
                return document.getElementById('swal-deactivation-note').value;
            },
        }).then(function (result) {
            if (! result.isConfirmed) return;
            var form = document.createElement('form');
            form.method = 'POST';
            form.action = '{{ route('admin.leads.agreement.deactivate', $lead) }}';
            var csrf = document.createElement('input');
            csrf.type = 'hidden'; csrf.name = '_token'; csrf.value = '{{ csrf_token() }}';
            var note = document.createElement('input');
            note.type = 'hidden'; note.name = 'deactivation_note'; note.value = result.value || '';
            form.appendChild(csrf);
            form.appendChild(note);
            document.body.appendChild(form);
            form.submit();
        });
    });
}());
@endif

// Agreement upload form: stop propagation, validate file, show loading state
(function () {
    var uploadForm = document.getElementById('agreementUploadFormEl');
    if (!uploadForm) { return; }

    uploadForm.addEventListener('submit', function (e) {
        e.stopPropagation();

        var fileInput = uploadForm.querySelector('input[type="file"][name="agreement_document"]');
        var btn       = document.getElementById('agreementUploadBtn');
        var feedback  = uploadForm.querySelector('.agreement-file-feedback');

        if (!fileInput || !fileInput.files || fileInput.files.length === 0) {
            e.preventDefault();
            if (fileInput) { fileInput.classList.add('is-invalid'); }
            if (feedback)  { feedback.textContent = 'Please select a PDF document to upload.'; feedback.style.display = 'block'; }
            return;
        }

        // Valid file — show loading state and prevent double-submit
        if (btn) {
            btn.disabled  = true;
            btn.innerHTML = '<span class="spinner-border spinner-border-sm me-1" role="status" aria-hidden="true"></span>Uploading...';
        }
    });

    // Clear inline validation when a new file is chosen
    var fileInputEl = uploadForm.querySelector('input[type="file"][name="agreement_document"]');
    if (fileInputEl) {
        fileInputEl.addEventListener('change', function () {
            this.classList.remove('is-invalid');
            var feedback = uploadForm.querySelector('.agreement-file-feedback');
            if (feedback) { feedback.style.display = 'none'; }
        });
    }
}());
</script>
@endpush