@extends('public.layout.app')
@section('title', __('front.quizzes'))

@section('body')
<section class="section" style="padding-top:110px;">
    <div class="container">
        @include('public.portals.student.partials.nav')

        <div class="card-soft p-4 shadow-soft">
            <div class="d-flex justify-content-between align-items-center mb-2">
                <h5 class="fw-bold mb-0">{{ __('front.quizzes') }}</h5>
            </div>

            @if(($quizzes ?? collect())->count() == 0)
                <div class="text-muted2">{{ __('front.no_quizzes_found') }}</div>
            @else
                <div class="row g-3">
                    @foreach($quizzes as $q)
                        <div class="col-md-6 col-lg-4">
                            <a href="{{ route('student.quizzes.show', $q->id) }}" class="text-decoration-none">
                                <div class="card-soft p-3 shadow-soft h-100">
                                    <div class="fw-semibold text-dark">{{ $q->title ?? 'Quiz' }}</div>

                                    <div class="text-muted2 small">
                                        {{ __('front.course') }}#{{ $q->course_id ?? '—' }}
                                        @if(!empty($q->starts_at))
                                            • Starts: {{ \Carbon\Carbon::parse($q->starts_at)->format('Y-m-d H:i') }}
                                        @endif
                                    </div>

                                    @if(!empty($q->status))
                                        <div class="mt-2">
                                            <span class="badge bg-primary">{{ $q->status }}</span>
                                        </div>
                                    @endif
                                </div>
                            </a>
                        </div>
                    @endforeach
                </div>

                <div class="mt-3">{{ $quizzes->links('pagination::bootstrap-4') }}</div>
            @endif
        </div>
    </div>
</section>
@endsection