@extends('layouts.app')

@section('title', __('clinic.notifications'))
@section('heading', __('clinic.notifications'))

@section('content')
    @if (auth()->user()->unreadNotifications->isNotEmpty())
        <form method="POST" action="{{ route('notifications.read-all') }}" class="mb-1">
            @csrf
            <button type="submit" class="btn btn-ghost btn-sm">{{ __('clinic.crm_mark_all_read') }}</button>
        </form>
    @endif

    <div class="card">
        @forelse ($notifications as $n)
            <div class="flex-between" style="padding:0.75rem 0;border-bottom:1px solid var(--border)">
                <div>
                    <div style="font-size:0.85rem">{{ $n->data['title'] ?? class_basename($n->type) }}</div>
                    @if (! empty($n->data['message']))
                        <div style="font-size:0.9rem">{{ $n->data['message'] }}</div>
                    @endif
                    <div style="font-size:0.8rem;color:var(--muted)">{{ $n->created_at->diffForHumans() }}</div>
                    @if (isset($n->data['due_at']))
                        <div style="font-size:0.8rem">{{ __('clinic.crm_due') }}: {{ $n->data['due_at'] }}</div>
                    @endif
                </div>
                <div class="flex gap">
                    @if ($n->unread())
                        <form method="POST" action="{{ route('notifications.read', $n->id) }}">
                            @csrf
                            <button type="submit" class="btn btn-ghost btn-sm">{{ __('clinic.crm_mark_read') }}</button>
                        </form>
                    @endif
                </div>
            </div>
        @empty
            <p style="text-align: center; color: var(--muted); padding: 1rem 0;">{{ __('clinic.crm_no_notifications') }}</p>
        @endforelse
    </div>
    @include('partials.pagination', ['paginator' => $notifications])
@endsection