{% extends 'index.html' %}

{% block content %}
{% if messages %}
    {% for ms in messages %}
        <div class="alert alert-warning">{{ ms }}</div>
    {% endfor %}
{% endif %}
<h2 class="mb-4">Buy a Ticket</h2>

<form method="POST">
    {% csrf_token %}

    <div class="mb-3">
        <label class="form-label">From</label>
        <select name="from" class="form-select">
            {% for s in stations %}
                <option value="{{ s.station_id }}">{{ s.station_name }}</option>
            {% endfor %}
        </select>
    </div>

    <div class="mb-3">
        <label class="form-label">To</label>
        <select name="to" class="form-select">
            {% for s in stations %}
                <option value="{{ s.station_id }}">{{ s.station_name }}</option>
            {% endfor %}
        </select>
    </div>
    <div class="mb-3">
        <label class="form-label">Email</label>
        <input type="email" name="email" class="form-control" required>
    </div>


    <button class="btn btn-primary" type="submit">Continue</button>
</form>
{% endblock %}