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

{% block title %}تفعيل الحساب{% endblock %}

{% block content %}
<div class="container hero-section">
    <div class="row justify-content-center">
        <div class="col-lg-6">
            <div class="glass-card">
                <h2 class="text-center mb-4 text-primary">تفعيل الحساب</h2>
                
                {% if error %}
                <div class="alert alert-danger">
                    {{ error }}
                </div>
                {% endif %}

                <p class="text-muted text-center mb-4">
                    لقد أرسلنا رموز التحقق إلى رقم هاتفك وبريدك الإلكتروني. الرجاء إدخالها أدناه.
                </p>

                <form method="post">
                    {% csrf_token %}
                    
                    <div class="mb-3">
                        <label class="form-label">رمز تحقق الهاتف</label>
                        <input type="text" name="mobile_otp" class="form-control" placeholder="رمز مكون من 6 أرقام" {% if student.is_mobile_verified %}value="تم التفعيل" disabled{% endif %} required>
                        {% if student.is_mobile_verified %}
                            <small class="text-success"><i class="fas fa-check-circle"></i> تم تفعيل الهاتف</small>
                        {% else %}
                            <small class="text-muted">أرسل إلى {{ student.mobile_number }}</small>
                        {% endif %}
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">رمز تحقق البريد</label>
                        <input type="text" name="email_otp" class="form-control" placeholder="رمز مكون من 6 أرقام" {% if student.is_email_verified %}value="تم التفعيل" disabled{% endif %} required>
                         {% if student.is_email_verified %}
                            <small class="text-success"><i class="fas fa-check-circle"></i> تم تفعيل البريد</small>
                        {% else %}
                            <small class="text-muted">أرسل إلى {{ student.user.email }}</small>
                        {% endif %}
                    </div>

                    <button type="submit" class="btn btn-success w-100 py-2 fs-5">تفعيل</button>
                </form>
            </div>
        </div>
    </div>
</div>
{% endblock %}