@extends('layouts.teacher-portal')
@section('title', 'My Classes')
@section('header', 'My Classes')

@section('content')
    <div class="grid grid-cols-1 gap-6 md:grid-cols-2 xl:grid-cols-3">
        @forelse ($classes as $class)
            <a href="{{ route('tportal.classes.show', [$school->id, $class->id]) }}" class="group rounded-2xl bg-white p-6 shadow-sm ring-1 ring-slate-900/5 transition hover:shadow-md">
                <div class="flex items-start justify-between">
                    <div>
                        <h3 class="font-display text-lg font-bold text-slate-900 group-hover:text-primary-700">{{ $class->name }}</h3>
                        <p class="text-xs text-slate-400">{{ $class->campus?->name ?? $school->name }}</p>
                    </div>
                    @if ($class->is_class_teacher)
                        <span class="rounded-full bg-primary-50 px-2.5 py-0.5 text-[11px] font-bold uppercase tracking-wide text-primary-700">Class Teacher</span>
                    @endif
                </div>
                <div class="mt-4 flex items-center gap-4 text-sm text-slate-500">
                    <span><strong class="text-slate-800">{{ $class->students_count }}</strong> students</span>
                    <span>&middot;</span>
                    <span>{{ $class->my_subjects->count() }} subject(s) taught by you</span>
                </div>
                @if ($class->my_subjects->isNotEmpty())
                    <div class="mt-3 flex flex-wrap gap-1.5">
                        @foreach ($class->my_subjects as $subject)
                            <span class="rounded-full bg-slate-100 px-2 py-0.5 text-[11px] font-medium text-slate-600">{{ $subject->name }}</span>
                        @endforeach
                    </div>
                @endif
            </a>
        @empty
            <div class="col-span-full rounded-2xl bg-white p-12 text-center shadow-sm ring-1 ring-slate-900/5">
                <p class="text-sm text-slate-400">No classes have been assigned to you yet. Your administrator manages assignments.</p>
            </div>
        @endforelse
    </div>
@endsection