<x-layouts.dashboard title="Notifications">
    <div class="table-card">
        <header class="table-head">
            <div><h3>Dashboard Notifications</h3><p>Request, payment, and delivery alerts saved for admin review.</p></div>
            <form method="post" action="{{ route('admin.notifications.read') }}">
                @csrf
                <button class="ghost small">Mark All Read</button>
            </form>
        </header>
        <table>
            <thead><tr><th>Title</th><th>Audience</th><th>Message</th><th>Status</th></tr></thead>
            <tbody>
                @forelse ($notifications as $notice)
                    <tr>
                        <td>{{ $notice->title }}</td>
                        <td>{{ $notice->audience }}</td>
                        <td>{{ $notice->body }}</td>
                        <td><span class="badge">{{ $notice->status }}</span></td>
                    </tr>
                @empty
                    <tr><td colspan="4"><div class="empty-state">Notifications for requests, payments, and delivery reminders will appear here.</div></td></tr>
                @endforelse
            </tbody>
        </table>
        {{ $notifications->links() }}
    </div>
</x-layouts.dashboard>
