@extends('admin.layout')

@section('title', 'Ucapan & Doa')

@section('content')

    <div class="mb-6">
        <h1 class="text-2xl font-semibold text-forest-950">Ucapan &amp; Doa</h1>
        <p class="text-sm text-forest-700/60 mt-1">Kelola ucapan yang masuk dari halaman undangan.</p>
    </div>

    <form method="GET" class="flex flex-wrap gap-3 mb-4">
        <input type="text" name="q" value="{{ $filters['q'] ?? '' }}" placeholder="Cari nama pengirim..."
               class="flex-1 min-w-[200px] rounded-lg border border-forest-950/15 px-4 py-2.5 text-sm focus:border-gold-500 focus:ring-0">
        <button type="submit" class="px-5 py-2.5 rounded-lg bg-forest-950/5 text-forest-950 text-sm font-medium hover:bg-forest-950/10 transition-colors">
            Cari
        </button>
    </form>

    <div class="space-y-3">
        @forelse ($wishes as $wish)
            <div class="bg-white rounded-xl border border-forest-950/10 p-5 flex items-start justify-between gap-4">
                <div class="min-w-0">
                    <div class="flex items-center gap-2 mb-1">
                        <p class="font-medium text-forest-950">{{ $wish->name }}</p>
                        <span class="text-[11px] px-2 py-0.5 rounded-full bg-forest-950/5 text-forest-700/60">{{ $wish->attendance_label }}</span>
                        @if ($wish->guest)
                            <span class="text-[11px] text-forest-700/40">· tamu: {{ $wish->guest->name }}</span>
                        @endif
                    </div>
                    <p class="text-sm text-forest-700/80">{{ $wish->message }}</p>
                    <p class="text-[11px] text-forest-700/40 mt-1.5">{{ $wish->sent_at->format('d M Y, H:i') }}</p>
                </div>
                <form method="POST" action="{{ route('admin.wishes.destroy', $wish) }}"
                      data-confirm="Hapus ucapan dari &quot;{{ $wish->name }}&quot;?" class="shrink-0">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="text-xs text-rose-600 hover:text-rose-700">Hapus</button>
                </form>
            </div>
        @empty
            <div class="bg-white rounded-xl border border-forest-950/10 p-10 text-center text-sm text-forest-700/50">
                Belum ada ucapan masuk.
            </div>
        @endforelse
    </div>

    <div class="mt-6">
        {{ $wishes->links() }}
    </div>

@endsection