{% extends 'base.html' %}
{% load static %}

{% block title %}{% if temporada %}Editar Temporada{% else %}Nueva Temporada{% endif %} | Gades Manager{% endblock title %}

{% block content %}
<div class="row mb-3 flex-shrink-0">
    <div class="col-12">
        <div class="bg-dark text-white p-3 rounded-3 shadow-sm" style="border-left: 5px solid #0d6efd;">
            <h1 class="display-6 fw-bold mb-1">{% if temporada %}Editar Temporada{% else %}Nueva Temporada{% endif %}</h1>
            <p class="text-white-50 mb-0">{% if temporada %}{{ temporada.nombre }}{% else %}Rellena los datos de la nueva temporada.{% endif %}</p>
        </div>
    </div>
</div>

<div class="row g-4" style="overflow-y: auto;">
    <div class="col-12 col-lg-8">
        <div class="card border-0 shadow-sm">
            <div class="card-body p-4">

                <form method="post">
                    {% csrf_token %}

                    <div class="mb-3">
                        <label for="{{ form.nombre.id_for_label }}" class="form-label fw-semibold">Nombre</label>
                        <input type="text" name="nombre" id="{{ form.nombre.id_for_label }}"
                               class="form-control {% if form.nombre.errors %}is-invalid{% endif %}"
                               value="{{ form.nombre.value|default:'' }}" placeholder="Ej: Gades 2025-26">
                        {% for error in form.nombre.errors %}
                            <div class="invalid-feedback">{{ error }}</div>
                        {% endfor %}
                    </div>

                    <div class="row g-2 mb-3">
                        <div class="col-6">
                            <label for="{{ form.fecha_inicio.id_for_label }}" class="form-label fw-semibold">Fecha de inicio</label>
                            {{ form.fecha_inicio }}
                            {% for error in form.fecha_inicio.errors %}
                                <div class="text-danger small mt-1">{{ error }}</div>
                            {% endfor %}
                        </div>
                        <div class="col-6">
                            <label for="{{ form.fecha_fin.id_for_label }}" class="form-label fw-semibold">Fecha de fin</label>
                            {{ form.fecha_fin }}
                            {% for error in form.fecha_fin.errors %}
                                <div class="text-danger small mt-1">{{ error }}</div>
                            {% endfor %}
                        </div>
                    </div>

                    <div class="mb-3">
                        <label for="{{ form.presupuesto.id_for_label }}" class="form-label fw-semibold">Presupuesto (€)</label>
                        <input type="number" name="presupuesto" id="{{ form.presupuesto.id_for_label }}"
                               class="form-control {% if form.presupuesto.errors %}is-invalid{% endif %}"
                               value="{{ form.presupuesto.value|default:'0.00' }}" step="0.01" min="0">
                        {% for error in form.presupuesto.errors %}
                            <div class="invalid-feedback">{{ error }}</div>
                        {% endfor %}
                    </div>

                    <div class="mb-4 form-check">
                        <input type="checkbox" name="actual" id="{{ form.actual.id_for_label }}"
                               class="form-check-input" {% if form.actual.value %}checked{% endif %}>
                        <label for="{{ form.actual.id_for_label }}" class="form-check-label fw-semibold">
                            Marcar como temporada activa
                        </label>
                        <div class="form-text">Solo puede haber una temporada activa. Al marcar esta se desactivarán las demás automáticamente.</div>
                    </div>

                    <div class="mb-4">
                        <label class="form-label fw-semibold">Miembros</label>
                        <div class="border rounded p-3" style="max-height: 220px; overflow-y: auto;">
                            {% for checkbox in form.miembros %}
                                <div class="form-check">
                                    {{ checkbox.tag }}
                                    <label class="form-check-label" for="{{ checkbox.id_for_label }}">
                                        {{ checkbox.choice_label }}
                                    </label>
                                </div>
                            {% empty %}
                                <span class="text-secondary small">No hay usuarios en el sistema.</span>
                            {% endfor %}
                        </div>
                    </div>

                    <div class="d-flex gap-2">
                        <button type="submit" class="btn btn-primary fw-bold px-4">Guardar</button>
                        <a href="{% url 'gestion_temporadas' %}" class="btn btn-outline-secondary px-4">Cancelar</a>
                    </div>
                </form>

            </div>
        </div>
    </div>
</div>
{% endblock content %}