@extends('layouts.parent')
@section('title', 'Report Cards')
@section('content')
    <x-page-head title="Report Cards" subtitle="Published results (read-only)" />
    <x-panel>
        @if ($students->isEmpty())
            <x-empty-state title="No children linked" message="Link your guardian account to view report cards." />
        @else
            <form method="GET" style="margin-bottom:16px;">
                <select class="input" name="student_id" onchange="this.form.submit()">
                    @foreach ($students as $student)
                        <option value="{{ $student->id }}" @selected($studentId == $student->id)>{{ $student->full_name }}</option>
                    @endforeach
                </select>
            </form>
            @if ($reportCards->isEmpty())
                <x-empty-state title="No published report cards" message="Report cards will appear here once published by the school." />
            @else
                <div class="table-wrap"><table><thead><tr><th>Term</th><th>Class</th><th>Average</th><th>Position</th><th>Published</th><th></th></tr></thead><tbody>
                    @foreach ($reportCards as $card)
                        <tr>
                            <td>{{ $card->term?->name }}</td>
                            <td>{{ $card->schoolClass?->name }}</td>
                            <td>{{ $card->overall_average }}</td>
                            <td>{{ $card->overall_position ?? '—' }}</td>
                            <td>{{ $card->published_at?->format('M j, Y') }}</td>
                            <td><a href="{{ route('parent.report-cards.show', $card) }}" class="btn btn-outline btn-sm">View</a></td>
                        </tr>
                    @endforeach
                </tbody></table></div>
            @endif
        @endif
    </x-panel>
@endsection
