{% extends 'manager.html' %}
{% block content %}
<div class="container mt-5">
    <div class="row justify-content-center">
        <div class="col-md-6">
            <div class="card shadow-lg border-0">
                <div class="card-header bg-primary text-white text-center">
                    <h5 class="mb-0"><i class="fas fa-user-edit me-2"></i> Editar Identidad del Cliente</h5>
                </div>
                <div class="card-body p-4">
                    <p class="text-muted small">Al cambiar estos datos, el cliente deberá usar el <b>nuevo correo</b> para iniciar sesión. El anterior quedará invalidado.</p>
                    <hr>
                    <form method="POST">
    {% csrf_token %}
    
    <div class="mb-3">
        <label class="form-label fw-bold">Nombre del Cliente (Usuario)</label>
        <div class="input-group">
            <span class="input-group-text"><i class="fas fa-user"></i></span>
            <input type="text" name="username" class="form-control" value="{{ cliente.username }}" required>
        </div>
    </div>

    <div class="mb-3">
        <label class="form-label fw-bold">Nuevo Correo Electrónico</label>
        <div class="input-group">
            <span class="input-group-text"><i class="fas fa-envelope"></i></span>
            <input type="email" name="email" class="form-control" value="{{ cliente.email }}" required>
        </div>
        <small class="text-muted">Este será el único correo válido para iniciar sesión.</small>
    </div>

    <div class="d-grid gap-2 d-md-flex justify-content-md-end mt-4">
        <a href="{% url 'modificar_correos_clientes' %}" class="btn btn-outline-secondary me-md-2">Cancelar</a>
        <button type="submit" class="btn btn-primary px-4">Guardar Cambios</button>
    </div>
</form>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}