{% extends 'base.html' %}
{% block title %}دریافت نوبت - انجمن علمی کامپیوتر لاهیجان{% endblock %}

{% block content %}
<div class="row justify-content-center">
    <div class="col-lg-6 col-md-8">
        
        <div class="text-center mb-4 pt-3">
            <i class="bi bi-mortarboard-fill header-icon"></i>
            <h2 style="color: var(--primary); font-weight: 800; letter-spacing: -0.5px;">انجمن علمی مهندسی کامپیوتر لاهیجان</h2>
            <p class="text-muted mt-2 fs-5">سامانه نوبت‌دهی آنلاین خدمات دانشجویی</p>
        </div>

        <div class="glass-card">
            <h4 class="mb-4 text-center fw-bold border-bottom pb-3"><i class="bi bi-card-text text-primary me-2"></i>فرم دریافت نوبت</h4>
            <form method="POST" action="/">
                <div class="mb-4">
                    <label class="form-label"><i class="bi bi-person me-1"></i> نام و نام خانوادگی</label>
                    <input type="text" name="name" class="form-control form-control-lg" placeholder="مثال: علی رضایی" required>
                </div>
                <div class="row">
                    <div class="col-md-6 mb-4">
                        <label class="form-label"><i class="bi bi-credit-card-2-front me-1"></i> کد ملی</label>
                        <input type="text" name="national_id" class="form-control form-control-lg text-start" dir="ltr" placeholder="0123456789" required pattern="[0-9]{10}">
                    </div>
                    <div class="col-md-6 mb-4">
                        <label class="form-label"><i class="bi bi-phone me-1"></i> شماره موبایل</label>
                        <input type="text" name="mobile" class="form-control form-control-lg text-start" dir="ltr" placeholder="09123456789" required pattern="09[0-9]{9}">
                    </div>
                </div>
                <div class="mb-4">
                    <label class="form-label"><i class="bi bi-book me-1"></i> رشته تحصیلی</label>
                    <select name="major_id" class="form-select form-select-lg" required>
                        <option value="">انتخاب کنید...</option>
                        {% for major in majors %}
                        <option value="{{ major.id }}">{{ major.name }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="mb-5">
                    <label class="form-label"><i class="bi bi-clipboard-check me-1"></i> نوع خدمت</label>
                    <select name="service" class="form-select form-select-lg" required>
                        <option value="UPLOAD">بارگذاری مدرک (۴۰۰,۰۰۰ تومان)</option>
                        <option value="VERIFICATION">تأییدیه تحصیلی (۱۰۰,۰۰۰ تومان)</option>
                        <option value="BOTH">هر دو مورد (۵۰۰,۰۰۰ تومان)</option>
                    </select>
                </div>
                <button type="submit" class="btn btn-primary w-100 py-3 fs-5">
                    <i class="bi bi-ticket-detailed me-2"></i> ثبت نام و دریافت نوبت
                </button>
            </form>
        </div>

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