@extends('admin.layout')

@section('title', 'Dashboard')

@section('content')

    <div class="mb-8">
        <h1 class="text-2xl font-semibold text-forest-950">Dashboard</h1>
        <p class="text-sm text-forest-700/60 mt-1">
            Ringkasan undangan {{ $wedding->groom_nickname }} &amp; {{ $wedding->bride_nickname }}.
        </p>
    </div>

    {{-- Kartu statistik utama --}}
    <div class="grid grid-cols-2 lg:grid-cols-4 gap-4 mb-8">
        <div class="bg-white rounded-xl border border-forest-950/10 p-5">
            <p class="text-xs text-forest-700/60 mb-1">Total Tamu</p>
            <p class="text-2xl font-semibold text-forest-950">{{ $stats['total_guests'] }}</p>
        </div>
        <div class="bg-white rounded-xl border border-forest-950/10 p-5">
            <p class="text-xs text-forest-700/60 mb-1">Sudah Buka Undangan</p>
            <p class="text-2xl font-semibold text-gold-600">{{ $stats['opened_guests'] }}</p>
        </div>
        <div class="bg-white rounded-xl border border-forest-950/10 p-5">
            <p class="text-xs text-forest-700/60 mb-1">Konfirmasi Hadir</p>
            <p class="text-2xl font-semibold text-emerald-600">{{ $stats['rsvp_hadir'] }}</p>
            <p class="text-[11px] text-forest-700/50 mt-0.5">{{ $stats['rsvp_hadir_orang'] }} orang</p>
        </div>
        <div class="bg-white rounded-xl border border-forest-950/10 p-5">
            <p class="text-xs text-forest-700/60 mb-1">Ucapan &amp; Doa</p>
            <p class="text-2xl font-semibold text-forest-950">{{ $stats['total_wishes'] }}</p>
        </div>
    </div>

    <div class="grid grid-cols-1 lg:grid-cols-2 gap-4 mb-8">
        <div class="bg-white rounded-xl border border-forest-950/10 p-5">
            <p class="text-xs text-forest-700/60 mb-1">Belum Buka Undangan</p>
            <p class="text-xl font-semibold text-forest-950">{{ $stats['unopened_guests'] }} tamu</p>
        </div>
        <div class="bg-white rounded-xl border border-forest-950/10 p-5">
            <p class="text-xs text-forest-700/60 mb-1">Tidak Hadir / Masih Ragu</p>
            <p class="text-xl font-semibold text-forest-950">{{ $stats['rsvp_tidak_hadir'] }} / {{ $stats['rsvp_ragu'] }}</p>
        </div>
    </div>

    <div class="mb-8">
        <a href="{{ route('admin.guests.create') }}"
           class="inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-forest-950 text-white text-sm font-medium hover:bg-forest-800 transition-colors">
            + Tambah Tamu Baru
        </a>
        <a href="{{ route('admin.guests.index') }}"
           class="inline-flex items-center gap-2 px-5 py-2.5 rounded-full border border-forest-950/15 text-forest-950 text-sm font-medium hover:bg-forest-950/5 transition-colors ml-2">
            Kelola Semua Tamu
        </a>
    </div>

    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
        {{-- Tamu terbaru --}}
        <div class="bg-white rounded-xl border border-forest-950/10 p-5">
            <h2 class="text-sm font-semibold text-forest-950 mb-4">Tamu Terbaru Ditambahkan</h2>
            @forelse ($recentGuests as $guest)
                <div class="flex items-center justify-between py-2 {{ !$loop->last ? 'border-b border-forest-950/5' : '' }}">
                    <div>
                        <p class="text-sm text-forest-950">{{ $guest->name }}</p>
                        <p class="text-xs text-forest-700/50">{{ $guest->category ?? 'Tanpa kategori' }}</p>
                    </div>
                    <span class="text-[11px] px-2 py-0.5 rounded-full {{ $guest->is_opened ? 'bg-emerald-50 text-emerald-700' : 'bg-forest-950/5 text-forest-700/60' }}">
                        {{ $guest->is_opened ? 'Sudah dibuka' : 'Belum dibuka' }}
                    </span>
                </div>
            @empty
                <p class="text-sm text-forest-700/50">Belum ada tamu. <a href="{{ route('admin.guests.create') }}" class="text-gold-600 underline">Tambah tamu pertama</a>.</p>
            @endforelse
        </div>

        {{-- Ucapan terbaru --}}
        <div class="bg-white rounded-xl border border-forest-950/10 p-5">
            <h2 class="text-sm font-semibold text-forest-950 mb-4">Ucapan Terbaru</h2>
            @forelse ($recentWishes as $wish)
                <div class="py-2 {{ !$loop->last ? 'border-b border-forest-950/5' : '' }}">
                    <p class="text-sm text-forest-950">{{ $wish->name }}</p>
                    <p class="text-xs text-forest-700/60 line-clamp-1">{{ $wish->message }}</p>
                </div>
            @empty
                <p class="text-sm text-forest-700/50">Belum ada ucapan masuk.</p>
            @endforelse
        </div>
    </div>

@endsection