{% extends "base.html" %}
{% block content %}
<div class="row justify-content-center">
  <div class="col-md-6">
    <div class="card shadow-sm">
      <div class="card-body">
        <h3 class="mb-3">Editar suscripción #{{ u.id }}</h3>

        <form method="post">
          <div class="mb-3">
            <label class="form-label">Cuenta</label>
            <select name="account_type" class="form-select" required>
              {% for t in account_types %}
                <option value="{{ t }}" {% if u.account_type==t %}selected{% endif %}>{{ t }}</option>
              {% endfor %}
            </select>
          </div>

          <div class="mb-3">
            <label class="form-label">Correo</label>
            <input type="email" name="email" value="{{ u.email }}" class="form-control" required>
          </div>

          <div class="mb-3">
            <label class="form-label">Perfil</label>
            <input type="number" name="profile" value="{{ u.profile }}" min="1" class="form-control" required>
          </div>

          <div class="mb-3">
            <label class="form-label">PIN</label>
            <input type="text" name="pin" value="{{ u.pin }}" class="form-control">
          </div>

          <div class="mb-3">
            <label class="form-label">Fecha de caducidad</label>
            <input type="date" name="expiry" value="{{ u.expiry_date }}" class="form-control">
          </div>

          <div class="mb-3">
            <label class="form-label">Celular (WhatsApp)</label>
            <input type="text" name="phone" value="{{ u.phone }}" class="form-control" placeholder="51 9xxxxxxxx">
          </div>

          <div class="mb-3">
            <label class="form-label">Contraseña para notificación (opcional)</label>
            <input type="text" name="pw_note" value="{{ u.pw_note }}" class="form-control" placeholder="Si se llena, se incluye en el WhatsApp">
          </div>

          <button class="btn btn-primary w-100">Guardar cambios</button>
        </form>

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