@extends('layouts.app')

@section('content')
    <div class="page">
        <div class="page-inner">
            <header class="page-title-bar">
                <h1 class="page-title">{{ __('Confirm Submission') }}</h1>
            </header>

            <div class="page-section">
                <div class="row justify-content-center">
                    <div class="col-lg-6">
                        <section class="card">
                            <div class="card-body text-center">
                                <h4>{{ $test->trans('name') }}</h4>
                                
                                <div class="my-4">
                                    <p class="mb-2">{{ __('Questions answered') }}:</p>
                                    <h2>{{ $answeredQuestions }} / {{ $totalQuestions }}</h2>
                                </div>

                                @if($answeredQuestions < $totalQuestions)
                                    <div class="alert alert-warning">
                                        <i class="fa fa-exclamation-triangle mr-1"></i>
                                        {{ __('You have not answered all questions. Are you sure you want to submit?') }}
                                    </div>
                                @endif

                                <div class="mt-4">
                                    <a href="{{ route('tests.user.page', ['test' => $test->id, 'page' => 1]) }}" class="btn btn-secondary mr-2">
                                        <i class="fa fa-arrow-left mr-1"></i> {{ __('Review Answers') }}
                                    </a>
                                    <a href="{{ route('tests.user.submit', $test->id) }}" class="btn btn-success">
                                        {{ __('Submit Test') }} <i class="fa fa-check ml-1"></i>
                                    </a>
                                </div>
                            </div>
                        </section>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection