{% extends "layouts/mobile_base.twig" %}

{% block title %}Nowa notatka — Consultant Panel{% endblock %}
{% block page_title %}Nowa notatka{% endblock %}
{% block page_subtitle %}Dodaj notatkę do placówki{% endblock %}

{% block content %}
<div class="page-content-loaded">

    <a href="{{ ROOT }}/shops/{{ shop_id }}/notes"
       class="d-inline-flex align-items-center gap-1 text-muted mb-3"
       style="font-size:.82rem;text-decoration:none;">
        <i class="bi bi-chevron-left"></i> Notatki
    </a>

    {% if errors.save is defined %}
        <div class="alert alert-danger rounded-3 mb-3" role="alert">
            <i class="bi bi-exclamation-circle me-2"></i>{{ errors.save }}
        </div>
    {% endif %}

    <form method="POST" action="{{ ROOT }}/shops/{{ shop_id }}/notes/new"
          enctype="multipart/form-data" novalidate>

        {# ── Typ notatki ── #}
        <div class="mb-3">
            <label class="form-label fw-600" style="font-size:.88rem;">Kategoria
                <span class="text-muted fw-400">(opcjonalna)</span>
            </label>
            <select name="note_type_id" class="form-select form-select-sm rounded-3">
                <option value="">— bez kategorii —</option>
                {% for type in note_types %}
                    <option value="{{ type.id }}"
                        {{ old('note_type_id') == type.id ? 'selected' : '' }}>
                        {{ type.name }}
                    </option>
                {% endfor %}
            </select>
        </div>

        {# ── Treść ── #}
        <div class="mb-3">
            <label class="form-label fw-600" style="font-size:.88rem;">
                Treść notatki <span class="text-danger">*</span>
            </label>
            <textarea name="content" rows="5"
                      class="form-control rounded-3 {{ errors.content is defined ? 'is-invalid' : '' }}"
                      placeholder="Opisz obserwację lub problem…" style="font-size:.9rem;">{{ old('content') }}</textarea>
            {% if errors.content is defined %}
                <div class="invalid-feedback">{{ errors.content }}</div>
            {% endif %}
        </div>

        <button type="submit" class="btn btn-primary w-100 rounded-pill py-2 fw-700">
            <i class="bi bi-check-lg me-2"></i>Zapisz notatkę
        </button>
    </form>

</div>
{% endblock %}