@extends('layouts.app')
@section('content')
<div class="px-4 lg:px-10 py-8">
<div class="flex justify-between items-end"><div><p class="pulso-label">Patient portal</p><h1 class="text-3xl font-display mt-1">Appointments</h1></div><a href="{{ route('portal.appointments.create') }}" class="bg-ink-900 text-white px-6 py-3 text-[11px] tracking-[0.14em] uppercase">Book Appointment</a></div>
<div class="mt-6 space-y-3">
@foreach($appointments as $a)
<div class="border border-stone-200 bg-white p-4 flex justify-between items-center">
<div><p class="font-medium text-sm">{{ $a->appointment_date->format('j M Y') }} — {{ $a->time_range }}</p><p class="text-[13px] text-ink-500">Dr. {{ $a->doctor->user->name ?? '' }} · {{ $a->status->label() }}</p></div>
@if($a->isCancellableByPatient())<form method="POST" action="{{ route('portal.appointments.cancel', $a) }}">@csrf @method('PATCH')<button class="border border-ink-900 px-4 py-2 text-[11px] tracking-wide uppercase">Cancel</button></form>@endif
</div>
@endforeach
</div>
<div class="mt-6">{{ $appointments->links() }}</div>
</div>
@endsection