@extends('layouts.admin')

@section('title', 'Timeline — ' . $record->fullName())

@section('content')
<x-ui.page-header
    title="Student timeline"
    :subtitle="$record->fullName()"
    :breadcrumbs="[
        ['label' => 'Home', 'href' => route('dashboard')],
        ['label' => 'Students', 'href' => route('registration.students.index')],
        ['label' => $record->fullName(), 'href' => route('registration.students.show', $record)],
        ['label' => 'Timeline'],
    ]"
/>

@include('institution.partials.flash')

<div class="row g-4">
    <div class="col-lg-6">
        <x-ui.card title="Workflow log">
            @forelse($workflowLogs ?? [] as $log)
                <div class="py-2 border-bottom border-secondary-subtle">
                    <strong>{{ $log->to_status ?? $log->step ?? 'Step' }}</strong>
                    <span class="text-muted-bv small d-block">{{ $log->created_at?->format('d M Y H:i') }} · {{ $log->user?->name ?? 'System' }}</span>
                    @if($log->notes ?? null)
                        <p class="small mb-0 mt-1">{{ $log->notes }}</p>
                    @endif
                </div>
            @empty
                <p class="text-muted-bv small mb-0">No workflow events yet.</p>
            @endforelse
        </x-ui.card>
    </div>
    <div class="col-lg-6">
        <x-ui.card title="Status changes">
            @forelse($statusChanges ?? [] as $change)
                <div class="py-2 border-bottom border-secondary-subtle">
                    <strong>{{ $change->from_status ?? '—' }} → {{ $change->to_status ?? '—' }}</strong>
                    <span class="text-muted-bv small d-block">{{ $change->created_at?->format('d M Y H:i') }} · {{ $change->approvedBy?->name ?? 'System' }}</span>
                    @if($change->reason ?? null)
                        <p class="small mb-0 mt-1">{{ $change->reason }}</p>
                    @endif
                </div>
            @empty
                <p class="text-muted-bv small mb-0">No status changes recorded.</p>
            @endforelse
        </x-ui.card>
    </div>
</div>
@endsection