{% extends "base.html" %}
{% block title %}Submit — {{ assignment.title }}{% endblock %}
{% block nav_courses_student %}active{% endblock %}

{% block content %}
<div class="page-header">
    <div>
        <a href="{% url 'content:student_assignments' course_pk=course.pk %}" class="text-muted small d-block mb-1">
            <i class="fa-solid fa-arrow-left me-1"></i> {{ course.name }} — Assignments
        </a>
        <h2><i class="fa-solid fa-upload me-2"></i>
            {% if existing %}Update Submission{% else %}Submit Assignment{% endif %}
        </h2>
        <p class="text-muted mb-0">{{ assignment.title }}</p>
    </div>
</div>

<div class="row justify-content-center">
    <div class="col-lg-7">

        {% if assignment.description %}
        <div class="portal-card mb-3">
            <div class="portal-card-body">
                <p class="small text-muted mb-0">
                    <strong>Assignment description:</strong><br>{{ assignment.description }}
                </p>
                {% if assignment.due_date %}
                <p class="small text-muted mb-0 mt-2">
                    <i class="fa-solid fa-clock me-1"></i>
                    <strong>Due:</strong> {{ assignment.due_date|date:"d M Y, H:i" }}
                    {% if assignment.is_overdue %}
                    <span class="text-danger fw-semibold ms-1">(Overdue — late submission)</span>
                    {% endif %}
                </p>
                {% endif %}
            </div>
        </div>
        {% endif %}

        {% if existing and existing.grade %}
        <div class="alert alert-info mb-3 small">
            <strong>Your grade:</strong>
            <span class="badge bg-{{ existing.grade_color }} ms-1">{{ existing.grade }}</span>
            {% if existing.feedback %}
            <br><strong>Feedback:</strong> {{ existing.feedback }}
            {% endif %}
        </div>
        {% endif %}

        <div class="portal-card">
            <div class="portal-card-header">
                <h6 class="mb-0">Your Submission</h6>
            </div>
            <div class="portal-card-body">
                <form method="post" enctype="multipart/form-data">
                    {% csrf_token %}

                    <div class="mb-3">
                        <label class="form-label fw-semibold">Upload File <span class="text-muted small">(optional)</span></label>
                        <input type="file" name="file" class="form-control"
                               accept=".pdf,.doc,.docx,.txt,.zip,.jpg,.jpeg,.png">
                        {% if existing and existing.file %}
                        <div class="mt-2 small">
                            <i class="fa-solid fa-paperclip me-1"></i>
                            Current file:
                            <a href="{{ existing.file.url }}" target="_blank">{{ existing.file.name|cut:"submissions/" }}</a>
                            — upload a new file to replace it.
                        </div>
                        {% endif %}
                        <div class="form-text">PDF, Word, images or ZIP. Max 50 MB.</div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-semibold">Notes <span class="text-muted small">(optional)</span></label>
                        <textarea name="notes" class="form-control" rows="4"
                                  placeholder="Any comments or notes for your teacher…">{{ existing.notes|default:'' }}</textarea>
                    </div>

                    {% if assignment.is_overdue %}
                    <div class="alert alert-warning py-2 small mb-3">
                        <i class="fa-solid fa-triangle-exclamation me-1"></i>
                        The due date has passed. Your submission will be marked as <strong>late</strong>.
                    </div>
                    {% endif %}

                    <button type="submit" class="btn btn-primary w-100">
                        <i class="fa-solid fa-upload me-1"></i>
                        {% if existing %}Update Submission{% else %}Submit Assignment{% endif %}
                    </button>
                </form>
            </div>
        </div>

    </div>
</div>
{% endblock %}