{% extends 'school/base_school.html' %}
{% block title %}Create Exam | STD Lab{% endblock %}
{% block page_title %}New Examination Period{% endblock %}

{% block content %}
<style>
    .card { border-radius: 0; border: 1px solid #e2e8f0; box-shadow: none; margin-bottom: 20px; background: #fff; max-width: 500px; padding: 25px; }
    .btn { border-radius: 0; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; padding: 12px 25px; cursor: pointer; }
    input { width: 100%; height: 45px; border: 1px solid #e2e8f0; border-radius: 0; padding: 0 10px; margin-top: 5px; font-weight: 700; outline: none; }
    label { font-size: 0.65rem; font-weight: 800; color: #94a3b8; text-transform: uppercase; }
</style>

<div class="card">
    <form method="post">
        {% csrf_token %}
        <div style="margin-bottom: 20px;">
            <label>Exam Name (e.g. First Term)</label>
            <input type="text" name="name" required placeholder="FIRST TERM EXAM">
        </div>
        <div style="margin-bottom: 30px;">
            <label>Year</label>
            <input type="number" name="year" value="2026" required>
        </div>
        <div style="display: flex; gap: 10px;">
            <button type="submit" class="btn" style="background: #0f172a; color: #fff; border: none; flex: 2;">CREATE EXAM</button>
            <a href="{% url 'exam_list' %}" class="btn" style="background: #f1f5f9; color: #64748b; text-decoration: none; text-align: center; flex: 1;">CANCEL</a>
        </div>
    </form>
</div>
{% endblock %}