{% extends 'school/base.html.twig' %}

{% block title %}{{ title }} | SALSABIL Madrassas{% endblock %}

{% block content %}
    <style>
        .category-form-shell{max-width:820px}
        .category-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
        .category-form-grid .form-row-full{grid-column:1/-1}
        .category-form-shell label{font-weight:700;color:#183835;margin-bottom:.35rem}
        .category-form-shell input,.category-form-shell textarea{width:100%;border:1px solid rgba(15,92,69,.16);border-radius:12px;padding:.78rem .9rem;background:#fff}
        .category-form-actions{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:flex-end;margin-top:1.2rem}
    </style>
    <div class="admin-page-stack category-form-shell">
        <section class="admin-page-header">
            <div>
                <p class="admin-eyebrow">DÉPENSES</p>
                <h1 class="admin-page-title">{{ title }}</h1>
                <p>Les catégories permettent de lire rapidement les sorties de caisse.</p>
            </div>
        </section>

        <section class="admin-card">
            {{ form_start(form) }}
                <div class="category-form-grid">
                    <div>{{ form_row(form.code) }}</div>
                    <div>{{ form_row(form.libelle) }}</div>
                    <div>{{ form_row(form.ordre) }}</div>
                    <div>{{ form_row(form.actif) }}</div>
                    <div class="form-row-full">{{ form_row(form.description) }}</div>
                </div>
                <div class="category-form-actions">
                    <a class="admin-btn admin-btn-light" href="{{ path('school_depense_category_index') }}">Annuler</a>
                    <button class="admin-btn admin-btn-primary" type="submit">Enregistrer</button>
                </div>
            {{ form_end(form) }}
        </section>
    </div>
{% endblock %}