@extends('layouts.app')

@section('titre', 'Mes cours')

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

        @if ($cours->isEmpty())
            <p class="mt-6 font-semibold" style="color:var(--sy-muted)">Pas encore de cours disponible. Fais ton premier TP pour voir apparaître son cours ici.</p>
        @else
            <ul class="mt-6 grid gap-3">
                @foreach ($cours as $c)
                    <li>
                        <a href="{{ route('mes-cours.show', $c) }}" class="flex items-center justify-between gap-4 rounded-2xl border p-4" style="border-color:var(--sy-line);background:var(--sy-surface)">
                            <span class="font-bold" style="color:var(--sy-ink)">{{ $c->titre }}</span>
                            <span class="font-mono text-sm font-semibold" style="color:var(--sy-muted)">Lire →</span>
                        </a>
                    </li>
                @endforeach
            </ul>
        @endif
    </div>
@endsection