{{-- $compact drops the card chrome and the chase list for embedding in the DSAR
     contact log, which already renders every chase in the activity feed. --}}
<div @class(['card shadow-sm mb-4' => !$compact])>
    <div @class(['card-body' => !$compact])>
        @unless($compact)
            <h4 class="fw-bold mb-3 d-flex align-items-center justify-content-between">
                Chases
                <span class="badge bg-secondary-subtle text-secondary">{{ $chases->count() }}</span>
            </h4>
        @endunless

        {{-- Record a chase --}}
        @can('dsars.responses.log')
            <form wire:submit.prevent="recordChase" class="mb-3">
                <div class="mb-2">
                    <label class="form-label label-upper">Notes <span class="text-muted fw-normal">(optional)</span></label>
                    <textarea wire:model="notes" rows="2"
                              class="form-control form-control-sm @error('notes') is-invalid @enderror"
                              placeholder="e.g. Chased by phone, left voicemail..."></textarea>
                    @error('notes') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <button type="submit" class="btn btn-primary btn-sm w-100">
                    <span wire:loading.remove wire:target="recordChase">
                        <i class="bi bi-telephone-outbound me-1"></i>Record Chase
                    </span>
                    <span wire:loading wire:target="recordChase">Saving...</span>
                </button>
            </form>
        @endcan

        {{-- Logged chases --}}
        @if($compact)
            {{-- shown in the contact log instead --}}
        @elseif($chases->isNotEmpty())
            @foreach($chases as $chase)
                <div class="border rounded p-2 mb-2 small">
                    <div class="d-flex justify-content-between align-items-center mb-1">
                        <span class="fw-semibold">
                            <i class="bi bi-telephone-outbound text-primary me-1"></i>Chase
                        </span>
                        <span class="text-muted" style="font-size:.75rem;">{{ $chase->chased_at?->format('d/m/Y') }}</span>
                    </div>
                    @if($chase->notes)
                        <p class="mb-1 text-muted">{{ $chase->notes }}</p>
                    @endif
                    <div class="text-muted" style="font-size:.75rem;">
                        by {{ $chase->user?->name ?? 'System' }}
                        &middot; {{ $chase->created_at->diffForHumans() }}
                    </div>
                </div>
            @endforeach
        @else
            <p class="text-muted small mb-0">No chases recorded yet.</p>
        @endif
    </div>
</div>