{% extends 'admin_base.html.twig' %}

{% block title %}Standortkategorien – Fit wie ein Fisch{% endblock %}
{% block header_title %}<i class="fas fa-tags me-2"></i>Standortkategorien{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link href="{{ asset('css/fisch-admin.css') }}" rel="stylesheet">
{% endblock %}

{% block content %}
{% include 'admin/fisch/_fisch_page_header.html.twig' with {
    title: 'Altersgruppen (A / B)',
    icon: 'tags',
    subtitle: 'Saison ' ~ seasonYear ~ ' — fest zwei Gruppen; Grenzen hier oder in den Grundeinstellungen ändern',
    breadcrumb_current: 'Standortkategorien'
} %}

{% for label, messages in app.flashes %}
    {% for message in messages %}
        <div class="alert alert-{{ label == 'error' ? 'danger' : label }} alert-dismissible fade show" role="alert">
            {{ message }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Schließen"></button>
        </div>
    {% endfor %}
{% endfor %}

<div class="alert border-0 shadow-sm mb-4" style="background: var(--fisch-admin-accent-soft);">
    <i class="fas fa-info-circle me-1"></i>
    Es gibt absichtlich nur <strong>zwei Altersgruppen</strong> (wie im Altsystem A/B).
    Freie „Kategorien anlegen“ ist nicht vorgesehen — die Grenzen steuern, welche Kurse nach Geburtsdatum sichtbar sind.
</div>

<div class="row g-4">
    <div class="col-lg-5">
        <div class="fisch-card h-100">
            <div class="card-header"><i class="fas fa-layer-group"></i> Aktuelle Gruppen</div>
            <div class="card-body">
                {% for category in categories %}
                    <div class="d-flex align-items-start gap-3 mb-3 {% if not loop.last %}pb-3 border-bottom{% endif %}">
                        <span class="fisch-age-badge{% if category.name == 'B' %} fisch-age-badge--b{% endif %}">
                            Gruppe {{ category.name }}
                        </span>
                        <div>
                            <div class="fw-semibold">{{ category.ageMin }}–{{ category.ageMax }} Jahre</div>
                            <div class="small text-muted">{{ category.description }}</div>
                            <code class="small">{{ category.code }}</code>
                        </div>
                    </div>
                {% endfor %}
            </div>
        </div>
    </div>
    <div class="col-lg-7">
        <div class="fisch-card h-100">
            <div class="card-header"><i class="fas fa-sliders-h"></i> Grenzen bearbeiten</div>
            <div class="card-body">
                <form method="post" action="{{ path('admin_fisch_location_categories_index') }}">
                    <input type="hidden" name="_token" value="{{ csrf_token('fisch_categories') }}">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <label class="form-label fw-semibold" for="age_min">Mindestalter</label>
                            <input type="number" class="form-control" name="age_min" id="age_min"
                                   value="{{ config.ageMin }}" min="3" max="17" required>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold" for="young_age_max">Gruppe A bis</label>
                            <input type="number" class="form-control" name="young_age_max" id="young_age_max"
                                   value="{{ config.youngAgeMax }}" min="3" max="17" required>
                            <div class="form-text">Obergrenze Gruppe A</div>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold" for="age_max">Höchstalter</label>
                            <input type="number" class="form-control" name="age_max" id="age_max"
                                   value="{{ config.ageMax }}" min="4" max="18" required>
                        </div>
                    </div>
                    <div class="d-flex flex-wrap gap-2 mt-4">
                        <button type="submit" class="btn btn-fisch-primary">
                            <i class="fas fa-save me-1"></i> Speichern
                        </button>
                        <a href="{{ path('admin_fisch_settings_index') }}" class="btn btn-fisch-outline">
                            Grundeinstellungen
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endblock %}