{% extends "base.html" %}
{% block title %}Drucker reservieren{% endblock %}
{% block content %}

<div class="section-header" style="display:flex; justify-content:space-between; align-items:center;">
    <h1>Drucker reservieren</h1>
    <a href="{{ url_for('profil.slots') }}" class="btn btn-secondary">Meine Slots</a>
</div>

{% if not drucker_liste %}
<div class="card" style="background:var(--error-bg); border-left: 4px solid var(--danger);">
    <strong>Kein Drucker frei.</strong> Alle Drucker sind derzeit gesperrt (Wartung / Reparatur).
    Frag den Lehrer, wann wieder reserviert werden kann.
</div>
{% else %}

<div class="card">
    <form method="post" style="display: grid; gap: 1rem;">

        <div>
            <label style="display:block; font-size: 0.9rem; color: var(--text-light); margin-bottom: 0.3rem;">
                Drucker *
            </label>
            <select name="drucker_id" required
                    style="padding: 0.6rem; width: 100%; border: 1px solid var(--border); border-radius: 4px; font-size: 1rem;">
                <option value="">— bitte waehlen —</option>
                {% for d in drucker_liste %}
                <option value="{{ d.id }}" {% if vorgewaehlt_drucker == d.id %}selected{% endif %}>
                    {{ d.name }} ({{ d.modell }})
                </option>
                {% endfor %}
            </select>
        </div>

        <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;">
            <div>
                <label style="display:block; font-size: 0.9rem; color: var(--text-light); margin-bottom: 0.3rem;">
                    Start *
                </label>
                <input type="datetime-local" name="start_zeit" required step="900"
                       value="{{ eingabe_start or default_start.strftime('%Y-%m-%dT%H:%M') }}"
                       min="{{ default_start.strftime('%Y-%m-%dT%H:%M') }}"
                       style="padding: 0.6rem; width: 100%; border: 1px solid var(--border); border-radius: 4px; font-size: 1rem;">
            </div>
            <div>
                <label style="display:block; font-size: 0.9rem; color: var(--text-light); margin-bottom: 0.3rem;">
                    Ende *
                </label>
                <input type="datetime-local" name="ende_zeit" required step="900"
                       value="{{ eingabe_ende or default_ende.strftime('%Y-%m-%dT%H:%M') }}"
                       style="padding: 0.6rem; width: 100%; border: 1px solid var(--border); border-radius: 4px; font-size: 1rem;">
            </div>
        </div>

        <div>
            <label style="display:block; font-size: 0.9rem; color: var(--text-light); margin-bottom: 0.3rem;">
                Notiz (optional)
            </label>
            <input type="text" name="notiz" maxlength="200"
                   value="{{ eingabe_notiz or '' }}"
                   placeholder="z.B. 'Schluesselanhaenger fuer Mama' oder '6h-Druck, lasse ueber Nacht'"
                   style="padding: 0.6rem; width: 100%; border: 1px solid var(--border); border-radius: 4px; font-size: 0.95rem;">
        </div>

        <div style="background: var(--info-bg); padding: 0.6rem 0.8rem; border-radius: 4px; font-size: 0.85rem; color: var(--text);">
            <strong>Regeln:</strong> Mindest-Dauer 15 Minuten, Maximum 24 Stunden.
            Achte darauf, dass dein Druck in deinem Slot fertig wird — sonst kann der naechste SuS nicht starten.
        </div>

        <div style="display: flex; justify-content: space-between;">
            <a href="{{ url_for('oeffentlich.drucker') }}" class="btn btn-secondary">Abbrechen</a>
            <button class="btn btn-primary">Reservieren</button>
        </div>
    </form>
</div>

{% endif %}

{% endblock %}