{% extends "master/base.html" %}

{% block content %}
<div class="card shadow-sm">
    <div class="card-body">
        <h3>{{ quiz.title }}</h3>
        <p class="text-muted">{{ quiz.description }}</p>
        <form method="post">
            {% csrf_token %}
            {% for item in question_items %}
                <div class="border rounded p-3 mb-3 bg-white">
                    <h5>{{ forloop.counter }}. {{ item.question.question }}</h5>
                    {% for option in item.options %}
                        <div class="form-check">
                            <input class="form-check-input" type="radio" name="{{ item.question.id }}" value="{{ option.id }}" id="option{{ option.id }}" required>
                            <label class="form-check-label" for="option{{ option.id }}">{{ option.option }}</label>
                        </div>
                    {% endfor %}
                </div>
            {% endfor %}
            <button type="submit" class="btn btn-success">Submit Quiz</button>
        </form>
    </div>
</div>
{% endblock %}