{% extends 'base.html' %}
{% load static %}

{% block title %}ExamAid - AI-Powered Study Assistant{% endblock %}

{% block content %}
<div class="bg-gradient-primary hero-section">
    <div class="container text-center">
        <h1 class="display-4">Welcome to ExamAid</h1>
        <p class="lead">Your AI-powered study assistant for competitive exams.</p>
    </div>
</div>

<div class="container my-5">
    <div class="row">
        <div class="col-md-6">
            <h2>Generate MCQs</h2>
            <p>Enter a topic to generate multiple-choice questions with detailed explanations.</p>
            <form method="post">
                {% csrf_token %}
                <div class="mb-3">
                    <label for="topic" class="form-label">Topic</label>
                    <input type="text" class="form-control" id="topic" name="topic" required>
                </div>
                <button type="submit" class="btn btn-primary">Generate MCQs</button>
            </form>
        </div>
        <div class="col-md-6">
            <h2>Generated Questions</h2>
            {% if mcqs %}
                {% for mcq in mcqs %}
                <div class="question-card">
                    <h5>{{ mcq.question }}</h5>
                    <ul class="options">
                        {% for option in mcq.options %}
                        <li>{{ option }}</li>
                        {% endfor %}
                    </ul>
                    <div class="explanation">
                        <p><strong>Correct Answer:</strong> {{ mcq.correct_answer }}</p>
                        <p><strong>Explanation:</strong> {{ mcq.explanation }}</p>
                    </div>
                </div>
                {% endfor %}
            {% else %}
                <p>No questions generated yet. Use the form to generate some!</p>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}
