{% extends "base.html" %}
{% block title %}{% if neu %}Neue Passage{% else %}Passage bearbeiten{% endif %}{% endblock %}
{% block content %}
<div class="flex items-center justify-between mb-5">
  <h1 class="page-title">{% if neu %}Neue Passage{% else %}Passage bearbeiten{% endif %}</h1>
  <a href="{% url 'marktbegleiter:passagen:liste' ausschreibung_id=ausschreibung.pk %}" class="btn-secondary">Abbrechen</a>
</div>
<p class="text-sm text-slate-500 mb-5">Ausschreibung: <strong>{{ ausschreibung.titel }}</strong></p>

<div class="card max-w-3xl" x-data="{ score: {{ passage.verlaesslichkeitsscore|default:5 }} }">
  <form method="post">
    {% csrf_token %}
    {% for field in form %}
    <div class="mb-4">
      <label class="form-label">{{ field.label }}</label>
      {% if field.name == 'verlaesslichkeitsscore' %}
      <div class="flex items-center gap-3">
        {{ field }}
        <span class="text-sm font-medium text-brand-600" x-text="score"></span>
        <span class="text-xs text-slate-400">(1=sehr unsicher, 10=sehr sicher)</span>
      </div>
      {% else %}
      {{ field }}
      {% endif %}
      {% if field.errors %}
      <p class="text-red-500 text-xs mt-1">{{ field.errors|join:", " }}</p>
      {% endif %}
    </div>
    {% endfor %}
    <div class="flex gap-3 mt-6">
      <button type="submit" class="btn-primary">Speichern</button>
    </div>
  </form>
</div>
{% endblock %}