<!DOCTYPE html>
<html lang="en" class="h-full app-shell">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>RSVP · {{ $room->title }}</title>
    @include('partials.favicon')
    @vite(['resources/css/app.css'])
</head>
<body class="flex min-h-screen items-center justify-center bg-slate-100 p-4 font-sans">
    <div class="max-w-md rounded-2xl border border-slate-200 bg-white p-8 shadow-sm">
        <h1 class="text-xl font-semibold text-slate-900">{{ $room->title }}</h1>
        <p class="mt-2 text-sm text-slate-600">You're invited as <strong>{{ $invitation->email }}</strong></p>
        @if ($room->scheduled_at)
            <p class="mt-2 text-sm text-slate-500">{{ $room->scheduled_at->timezone($room->timezone)->format('M j, Y g:i A T') }}</p>
        @endif
        <form method="POST" action="{{ route('meet.invitations.rsvp', ['invitation' => $invitation, 'token' => request('token')]) }}" class="mt-6 flex gap-3">
            @csrf
            <button name="status" value="accepted" type="submit" class="btn-primary flex-1">Accept</button>
            <button name="status" value="declined" type="submit" class="flex-1 rounded-lg border border-slate-300 px-4 py-2 text-sm hover:bg-slate-50">Decline</button>
        </form>
    </div>
</body>
</html>
