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

{% block content %}
    <div class="container physics my-3">
        {% include 'user_score_header.html' %}

        <div class="card">
            <div class="card-body p-0">
                <ul class="list-group list-group-flush score-answer-list">
                    {% for question, ans in answers_and_marks %}
                        <li class="list-group-item">
                            <div class="d-flex align-items-start">
                                <div class="me-3">
                                    {% if request.user.is_authenticated %}
                                        <a href="{% url 'physics:exam_take_user' pk=exam.id sk=forloop.counter0 %}" class="text-decoration-none">
                                            <span class="badge bg-secondary">{{ forloop.counter }}</span>
                                        </a>
                                    {% else %}
                                        <a href="{% url 'physics:exam_take' exam.pk forloop.counter0 cid passcode %}" class="text-decoration-none">
                                            <span class="badge bg-secondary">{{ forloop.counter }}</span>
                                        </a>
                                    {% endif %}
                                </div>
                                <div class="flex-grow-1">
                                    <div class="fw-bold mb-2">
                                        {% if request.user.is_authenticated %}
                                            <a href="{% url 'physics:exam_take_user' pk=exam.id sk=forloop.counter0 %}" class="text-decoration-none text-body">{{ question.stem|safe }}</a>
                                        {% else %}
                                            <a href="{% url 'physics:exam_take' exam.pk forloop.counter0 cid passcode %}" class="text-decoration-none text-body">{{ question.stem|safe }}</a>
                                        {% endif %}
                                        {% if request.user.is_staff or view_all_results or request.user in exam.author.all %}
                                            {% with ua=user_answers_map|get_item:question.pk %}
                                                {% if ua %}
                                                    <a href="{% url 'generic:view_answer_history' app_name='physics' model_name='UserAnswer' pk=ua.pk %}" class="btn btn-sm btn-outline-info ms-2" style="font-size: 11px; padding: 2px 6px; vertical-align: middle;">History</a>
                                                {% endif %}
                                            {% endwith %}
                                        {% endif %}
                                    </div>

                                    <div class="mb-2">
                                        <ol type="a" class="mb-0">
                                            {% for q, a, score, correct_answer in ans %}
                                                <li class="d-flex justify-content-between align-items-start py-2 mb-2 border-bottom">
                                                    <div class="pe-3"><span class="me-2"></span><span>{{ q|safe }}</span></div>
                                                    <div class="text-end">
                                                        {% if exam.publish_results %}
                                                            <div class="text-primary fw-semibold">Correct answer: {{ correct_answer|safe }}</div>
                                                        {% endif %}
                                                        <div class="submitted-user-answer">{{ a }}</div>
                                                        {% if exam.publish_results or view_all_results %}
                                                            <div class="answer-{{score}} small">(Score: {{score}})</div>
                                                        {% endif %}
                                                        {% if exam.publish_results %}
                                                            {% if forloop.counter0 == 0 and question.a_feedback %}
                                                                <div class="small text-muted mt-1 text-end">Feedback: {{ question.a_feedback|safe }}</div>
                                                            {% elif forloop.counter0 == 1 and question.b_feedback %}
                                                                <div class="small text-muted mt-1 text-end">Feedback: {{ question.b_feedback|safe }}</div>
                                                            {% elif forloop.counter0 == 2 and question.c_feedback %}
                                                                <div class="small text-muted mt-1 text-end">Feedback: {{ question.c_feedback|safe }}</div>
                                                            {% elif forloop.counter0 == 3 and question.d_feedback %}
                                                                <div class="small text-muted mt-1 text-end">Feedback: {{ question.d_feedback|safe }}</div>
                                                            {% elif forloop.counter0 == 4 and question.e_feedback %}
                                                                <div class="small text-muted mt-1 text-end">Feedback: {{ question.e_feedback|safe }}</div>
                                                            {% endif %}
                                                        {% endif %}
                                                    </div>
                                                </li>
                                            {% endfor %}
                                        </ol>
                                    </div>

                                    <div class="mt-3 pt-2 border-top">
                                        <div class="small text-muted">
                                            {% if request.user.is_staff %}
                                                — Category: {{ question.category }}
                                                <a href="{% url 'physics:question_detail' pk=question.pk %}">View</a>
                                                <a href="{% url 'admin:physics_question_change' question.id %}" class="ms-2">Edit</a>
                                            {% endif %}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        </div>

        {% include 'user_scores_footer.html' %}
    </div>
{% endblock %}