{% extends 'base.html' %}
{% block title %}Add Bus{% endblock %}
{% block content %}
<div style="max-width:460px; margin:0 auto;">
    <h2 style="text-align:center; color:#2c3e50;">➕ Add a new bus</h2>
    <p style="text-align:center; color:#7f8c8d; margin-bottom:25px;">
        The bus goes to the admin for review. It becomes bookable only after approval.
    </p>

    <form method="post" action="{% url 'add_bus' %}">
        {% csrf_token %}
        <div style="margin-bottom:15px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Bus name *</label>
            <input type="text" name="bus_name" required
                style="width:100%; padding:12px 15px; border:2px solid #dfe6e9; border-radius:10px;">
        </div>
        <div style="margin-bottom:15px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Registration number *</label>
            <input type="text" name="registration_no" required
                style="width:100%; padding:12px 15px; border:2px solid #dfe6e9; border-radius:10px;">
        </div>
        <div style="margin-bottom:15px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Bus type *</label>
            <select name="bus_type"
                style="width:100%; padding:12px 15px; border:2px solid #dfe6e9; border-radius:10px;">
                {% for value, label in bus_types %}
                <option value="{{ value }}">{{ label }}</option>
                {% endfor %}
            </select>
        </div>
        <div style="margin-bottom:25px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Total seats *</label>
            <input type="number" name="total_seats" min="1" required
                style="width:100%; padding:12px 15px; border:2px solid #dfe6e9; border-radius:10px;">
        </div>
        <button type="submit" class="btn btn-primary" style="width:100%;">Submit for admin review</button>
    </form>

    <p style="text-align:center; margin-top:20px;">
        <a href="{% url 'operator_buses' %}" style="color:#3498db; font-weight:600;">Back to my buses</a>
    </p>
</div>
{% endblock %}