@extends('layouts.app')

@section('titre', 'Résultats')

@section('contenu')
    <div class="mx-auto max-w-4xl px-5 py-10">
        <h1 class="text-3xl font-extrabold" style="color:var(--sy-ink)">Résultats</h1>

        @if ($resultats->isEmpty())
            <p class="mt-6 font-semibold" style="color:var(--sy-muted)">Crée d'abord une classe.</p>
        @else
            <ul class="mt-6 grid gap-5">
                @foreach ($resultats as $r)
                    <li class="rounded-2xl border p-5" style="border-color:var(--sy-line);background:var(--sy-surface)">
                        <div class="flex flex-wrap items-center justify-between gap-3">
                            <a href="{{ route('mes-classes.show', $r['classe']) }}" class="text-lg font-extrabold underline" style="color:var(--sy-ink)">{{ $r['classe']->nom }}</a>
                            <span class="font-mono text-sm font-semibold" style="color:var(--sy-muted)">
                                {{ $r['nombreCorrections'] }} correction(s)
                                @if ($r['reussiteMoyenne'] !== null) · {{ $r['reussiteMoyenne'] }} % de réussite @endif
                            </span>
                        </div>
                        @if ($r['observations']->isNotEmpty())
                            <ul class="mt-4 grid gap-2">
                                @foreach ($r['observations'] as $observation)
                                    <li class="rounded-xl p-3 text-sm font-semibold" style="background:var(--sy-bg);color:var(--sy-ink)">
                                        <span class="font-mono text-xs" style="color:var(--sy-muted)">{{ $observation->eleve->nomAffiche() }} · {{ $observation->created_at->translatedFormat('d/m') }}</span>
                                        <br>{{ $observation->contenu }}
                                    </li>
                                @endforeach
                            </ul>
                        @endif
                        <p class="mt-3 text-sm font-semibold"><a href="{{ route('mes-classes.show', $r['classe']) }}" class="underline" style="color:var(--sy-blue)">Ajouter une observation →</a></p>
                    </li>
                @endforeach
            </ul>
        @endif
    </div>
@endsection