{% extends 'base.html' %}
{% block title %}{% if schedule %}Edit{% else %}New{% endif %} Trip{% endblock %}
{% block topbar_title %}Schedule Management{% endblock %}
{% block content %}
<div style="max-width:480px;">
    <h1 class="page-title">{% if schedule %}✏️ Edit trip{% else %}➕ New trip{% endif %}</h1>
    <p class="page-sub">Pick one of your approved buses and an active route.</p>
    <form method="post" class="card">
        {% csrf_token %}
        <div style="margin-bottom:15px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Bus *</label>
            <select name="bus" style="width:100%; padding:12px; border:1px solid var(--border); border-radius:10px; background:#fff;">
                <option value="">— choose —</option>
                {% for b in buses %}
                <option value="{{ b.id }}"{% if schedule.bus_id == b.id %} selected{% endif %}>{{ b.bus_name }} ({{ b.bus_type }}, {{ b.total_seats }} seats)</option>
                {% endfor %}
            </select>
        </div>
        <div style="margin-bottom:15px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Route *</label>
            <select name="route" style="width:100%; padding:12px; border:1px solid var(--border); border-radius:10px; background:#fff;">
                <option value="">— choose —</option>
                {% for r in routes %}
                <option value="{{ r.id }}"{% if schedule.route_id == r.id %} selected{% endif %}>{{ r.source_city.city_name }} → {{ r.destination_city.city_name }}</option>
                {% endfor %}
            </select>
        </div>
        <div style="margin-bottom:15px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Departure *</label>
            <input type="datetime-local" name="departure_time" value="{{ schedule.departure_time|date:'Y-m-d\TH:i' }}" style="width:100%; padding:12px; border:1px solid var(--border); border-radius:10px;">
        </div>
        <div style="margin-bottom:15px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Arrival *</label>
            <input type="datetime-local" name="arrival_time" value="{{ schedule.arrival_time|date:'Y-m-d\TH:i' }}" style="width:100%; padding:12px; border:1px solid var(--border); border-radius:10px;">
        </div>
        <div style="margin-bottom:20px;">
            <label style="display:block; font-weight:600; margin-bottom:6px;">Fare (Rs.) *</label>
            <input type="number" name="fare" value="{{ schedule.fare|default:'' }}" style="width:100%; padding:12px; border:1px solid var(--border); border-radius:10px;">
        </div>
        <button type="submit" class="btn" style="width:100%;">Save trip</button>
    </form>
    <p style="margin-top:15px;"><a href="{% url 'operator_schedules' %}" style="color:var(--secondary); font-weight:600;">← Back to trips</a></p>
</div>
{% endblock %}