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

{% block title %}Configuration{% endblock %}

{% set section_labels = {
	'generales': {'label': 'Informations générales', 'icon': 'fas fa-school'},
	'stocks':    {'label': 'Stocks',                  'icon': 'fas fa-boxes'}
} %}

{% block body %}
<div class="d-flex justify-content-between align-items-center mb-4">
	<h1 class="h3 mb-0"><i class="fas fa-sliders-h me-2"></i>Configuration</h1>
</div>

{# ── Onglets navigation configuration ───────────────────────────────────── #}
<ul class="nav nav-tabs mb-4">
    <li class="nav-item">
        <a class="nav-link active" href="{{ path('tenant_configuration_index') }}">
            <i class="fas fa-cog me-1"></i>Général
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="{{ path('tenant_configuration_restaurant') }}">
            <i class="fas fa-utensils me-1"></i>Restaurant
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="{{ path('tenant_configuration_email') }}">
            <i class="fas fa-envelope me-1"></i>Email
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="{{ path('tenant_configuration_notifications') }}">
            <i class="fas fa-bell me-1"></i>Notifications
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="{{ path('tenant_configuration_personnalisation') }}">
            <i class="fas fa-palette me-1"></i>Personnalisation
        </a>
    </li>
</ul>

{% for message in app.flashes('success') %}
	<div class="alert alert-success alert-dismissible fade show" role="alert">
		{{ message }}
		<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
	</div>
{% endfor %}

{% if sections is empty %}
	<div class="card border-0 shadow-sm rounded-3">
		<div class="card-body text-center py-5 text-muted">
			<i class="fas fa-sliders-h fa-3x mb-3 opacity-25"></i>
			<p class="mb-0">Aucune configuration enregistrée.</p>
		</div>
	</div>
{% else %}
	<form method="post" action="{{ path('tenant_configuration_save') }}">
		{% for section, lignes in sections %}
			{% set meta = section_labels[section] ?? {'label': section|capitalize, 'icon': 'fas fa-folder-open'} %}
			<div class="card border-0 shadow-sm rounded-3 mb-3">
				<div class="card-header bg-white border-bottom fw-semibold py-3">
					<i class="{{ meta.icon }} me-2 text-primary"></i>{{ meta.label }}
				</div>
				<div class="card-body">
					<div class="row g-3">
						{% for ligne in lignes %}
							<div class="col-md-6">
								<label class="form-label small fw-semibold">
									{{ ligne.description ?: ligne.cle }}
								</label>
								<div class="input-group input-group-sm">
									{% if ligne.type_donnee == 'number' and 'tarif' in ligne.cle %}
										<input type="number" step="0.01" min="0"
											class="form-control"
											name="config[{{ section }}__{{ ligne.cle }}]"
											value="{{ ligne.valeur }}">
										<span class="input-group-text">€</span>
									{% elseif ligne.type_donnee == 'number' and 'taux' in ligne.cle %}
										<input type="number" step="0.1" min="0" max="100"
											class="form-control"
											name="config[{{ section }}__{{ ligne.cle }}]"
											value="{{ ligne.valeur }}">
										<span class="input-group-text">%</span>
									{% elseif ligne.type_donnee == 'number' %}
										<input type="number" min="0"
											class="form-control"
											name="config[{{ section }}__{{ ligne.cle }}]"
											value="{{ ligne.valeur }}">
									{% else %}
										<input type="text"
											class="form-control"
											name="config[{{ section }}__{{ ligne.cle }}]"
											value="{{ ligne.valeur }}">
									{% endif %}
								</div>
							</div>
						{% endfor %}
					</div>
				</div>
			</div>
		{% endfor %}

		<div class="d-flex justify-content-end mt-3">
			<button type="submit" class="btn btn-primary">
				<i class="fas fa-save me-1"></i>Enregistrer
			</button>
		</div>
	</form>
{% endif %}
{% endblock body %}