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

@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">
                <div>
                    <h5 class="fw-bold mb-0">{{ $quiz->title ?? 'Quiz' }}</h5>
                    <div class="text-muted2 small">
                        {{ __('front.course') }}#{{ $quiz->course_id ?? '—' }}
                        @if(!empty($quiz->duration_minutes))
                            • Duration: {{ $quiz->duration_minutes }} min
                        @endif
                    </div>
                </div>
            </div>

            <form method="POST" action="{{ route('student.quizzes.submit', $quiz->id) }}">
                @csrf

                @if(($questions ?? collect())->count() == 0)
                    <div class="text-muted2">
                        Questions module not added yet. (Submit will create attempt record if table exists)
                    </div>

                    <div class="mt-3">
                        <label class="form-label">{{ __('front.demo_answer') }}</label>
                        <input class="form-control" name="demo_answer" placeholder="{{ __('front.type_anything') }}">
                    </div>
                @else
                    @foreach($questions as $i => $q)
                        <div class="mb-3">
                            <div class="fw-semibold mb-1">{{ $i+1 }}. {{ $q->question_text }}</div>
                            <input class="form-control" name="answers[{{ $q->id }}]" placeholder="{{ __('front.your_answer') }}">
                        </div>
                    @endforeach
                @endif

                <button class="btn btn-primary btn-sm mt-2">
                    <i class="fa-solid fa-paper-plane me-1"></i> {{ __('front.submit_quiz') }}
                </button>
            </form>
        </div>

    </div>
</section>
@endsection