@extends('layouts.app')

@section('header', 'Resultado do Quiz')

@section('breadcrumbs')
    @php
        $breadcrumbs = [
            'Tutorial' => route('tutorial.index'),
            'Resultado' => route('tutorial.quiz')
        ];
    @endphp
@endsection

@section('content')
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 fw-bold text-primary">Resultado do Quiz</h6>
        </div>
        <div class="card-body">
            @if($passed)
                <div class="alert alert-success">
                    <h4 class="alert-heading"><i class="bi bi-trophy me-2"></i>Parabéns!</h4>
                    <p>Você acertou <strong>{{ $score }}</strong> de {{ count($results) }} perguntas e foi aprovado no quiz!</p>
                    <hr>
                    <p class="mb-0">Agora você pode baixar seu certificado de conclusão do curso.</p>
                </div>

                <div class="text-center mt-4">
                    <a href="{{ route('tutorial.certificate') }}" class="btn btn-success btn-lg">
                        <i class="bi bi-download me-2"></i>Baixar Certificado PDF
                    </a>
                </div>
            @else
                <div class="alert alert-danger">
                    <h4 class="alert-heading"><i class="bi bi-x-circle me-2"></i>Não foi desta vez</h4>
                    <p>Você acertou <strong>{{ $score }}</strong> de {{ count($results) }} perguntas. É necessário acertar pelo menos <strong>6 de 10</strong> para ser aprovado.</p>
                    <hr>
                    <p class="mb-0">Revise as lições e tente novamente!</p>
                </div>

                <div class="text-center mt-4">
                    <a href="{{ route('tutorial.index') }}" class="btn btn-primary btn-lg">
                        <i class="bi bi-book me-2"></i>Revisar Lições
                    </a>
                    <a href="{{ route('tutorial.quiz') }}" class="btn btn-warning btn-lg ms-2">
                        <i class="bi bi-arrow-repeat me-2"></i>Tentar Novamente
                    </a>
                </div>
            @endif

            <div class="mt-5">
                <h4>Detalhes das Respostas</h4>
                @foreach($results as $index => $result)
                    <div class="card mb-3 {{ $result['is_correct'] ? 'border-success' : 'border-danger' }}">
                        <div class="card-body">
                            <h5 class="card-title">
                                Pergunta {{ $index + 1 }}
                                @if($result['is_correct'])
                                    <i class="bi bi-check-circle text-success ms-2"></i>
                                @else
                                    <i class="bi bi-x-circle text-danger ms-2"></i>
                                @endif
                            </h5>
                            <p class="card-text">{{ $result['question'] }}</p>

                            <div class="mt-3">
                                <p><strong>Sua resposta:</strong> {{ $result['your_answer'] ?? 'Não respondida' }}</p>
                                @if(!$result['is_correct'])
                                    <p class="text-success"><strong>Resposta correta:</strong> {{ $result['correct_answer'] }}</p>
                                @endif
                                <p class="text-muted"><strong>Explicação:</strong> {{ $result['explanation'] }}</p>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </div>
@endsection