{{--
    ══════════════════════════════════════════════════════════════
    Follow-Ups section — include in leads/edit.blade.php
    Place OUTSIDE your main lead <form> tag, below appointments.

    @include('leads.partials._followups_section')

    Requires:
      $lead — with followUps eager-loaded
    ══════════════════════════════════════════════════════════════
--}}

<div class="card mt-4" id="followups-section">
    <div class="card-header d-flex align-items-center justify-content-between">
        <h5 class="mb-0">
            <i class="fas fa-phone-alt me-2"></i>Follow-Ups
        </h5>
        <!-- <button type="button" class="btn btn-sm btn-primary"
                data-bs-toggle="modal" data-bs-target="#addFollowUpModal">
            <i class="fas fa-plus me-1"></i> Add Follow-Up
        </button> -->
    </div>

    <div class="card-body p-0">
        @if ($lead->followUps->isEmpty())
            <div class="text-center py-4 text-muted">
                <i class="fas fa-comments fa-2x mb-2 d-block"></i>
                No follow-ups yet. Click <strong>Add Follow-Up</strong> to add one.
            </div>
        @else
            <div class="table-responsive">
                <table class="table table-hover mb-0 w-full">
                    <thead class="table-dark">
                        <tr>
                            <th>#</th>
                            <th>Type</th>
                            <th>Date</th>
                            <th>Time</th>
                            <th>Feedback</th>
                            <th class="text-center">Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($lead->followUps as $i => $fu)
                            <tr>
                                <td>{{ $i + 1 }}</td>
                                <td>
                                    @php
                                        $badge = match($fu->follow_up_type) {
                                            'Online Meeting'  => 'bg-info text-dark',
                                            'Offline Meeting' => 'bg-secondary',
                                            default           => 'bg-primary',
                                        };
                                    @endphp
                                    <span class="badge {{ $badge }}">
                                        {{ $fu->follow_up_type }}
                                    </span>
                                </td>
                                <td>{{ $fu->follow_up_date
                                        ? $fu->follow_up_date->format('d-m-Y') : '—' }}</td>
                                <td>
                                    {{ $fu->follow_up_time
                                        ? \Carbon\Carbon::createFromFormat('H:i:s', $fu->follow_up_time)->format('h:i A')
                                        : '—' }}
                                </td>
                                <td>{{ Str::limit($fu->feedback, 60) ?? '—' }}</td>
                                <td class="text-center">
                                    <form method="POST"
                                          action="{{ route('leads.followups.destroy', [$lead, $fu]) }}"
                                          onsubmit="return confirm('Delete this follow-up?')">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="btn btn-sm btn-outline-danger">
                                            <i class="fas fa-trash-alt"></i>
                                        </button>
                                    </form>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @endif
    </div>
</div>

{{-- ── Add Follow-Up Modal ────────────────────────────────────── --}}
<div class="modal fade" id="addFollowUpModal" tabindex="-1"
     aria-labelledby="addFollowUpModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">

            <div class="modal-header bg-dark text-white">
                <h5 class="modal-title" id="addFollowUpModalLabel"></h5>
                <button type="button" class="btn-close btn-close-white"
                        data-bs-dismiss="modal" aria-label="Close"></button>
            </div>

            <form method="POST" action="{{ route('leads.followups.store', $lead) }}">
                @csrf
                <div class="modal-body">

                    {{-- Follow-Up Type --}}
                    <div class="mb-3">
                        <label class="form-label">Follow Up Type <span class="text-danger">*</span></label>
                        <select name="follow_up_type" required
                                class="input form-select @error('follow_up_type') is-invalid @enderror">
                            <option value="">Select</option>
                            <option value="Online Meeting">Online Meeting</option>
                            <option value="Offline Meeting">Offline Meeting</option>
                            <option value="On Call Meeting">On Call Meeting</option>
                        </select>
                        @error('follow_up_type')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    {{-- Follow-Up Date --}}
                    <div class="mb-3">
                        <label class="form-label">Follow Up Date</label>
                        <input type="date" name="follow_up_date"
                               class="input form-control @error('follow_up_date') is-invalid @enderror">
                        @error('follow_up_date')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    {{-- Follow-Up Time --}}
                    <div class="mb-3">
                        <label class="form-label">Follow Up Time</label>
                        <input type="time" name="follow_up_time" placeholder="Click On"
                               class="input form-control @error('follow_up_time') is-invalid @enderror">
                        @error('follow_up_time')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    {{-- Feedback --}}
                    <div class="mb-3">
                        <label class="form-label">Feedback</label>
                        <textarea name="feedback" rows="4" placeholder="Add"
                                  class="input form-control @error('feedback') is-invalid @enderror"></textarea>
                        @error('feedback')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                </div>

                <div class="modal-footer justify-content-center border-0 pt-0">
                    <button type="submit"
                            class="btn btn-primary flex-1 justify-center">
                        <i class="fas fa-plus me-1"></i> Add Follow Up
                    </button>
                </div>
            </form>

        </div>
    </div>
</div>