{% extends "django_meta_whatsapp/base.html" %}
{% block title %}{% if object %}Edit{% else %}Add{% endif %} {{ name|title }}{% endblock %}
{% block page_title %}{% if object %}Edit{% else %}Add{% endif %} {% if "apikey" == "account" %}Account{% else %}API Key{% endif %}{% endblock %}
{% block content %}
<div class="max-w-lg">
  <div class="bg-white rounded-xl border border-gray-100 shadow-sm p-6">
    <form method="post">
      {% csrf_token %}
      {% for field in form %}
      <div class="mb-4">
        <label class="block text-sm font-medium text-gray-700 mb-1">{{ field.label }}</label>
        {{ field }}
        {% if field.errors %}<p class="text-xs text-red-600 mt-1">{{ field.errors|join:", " }}</p>{% endif %}
        {% if field.help_text %}<p class="text-xs text-gray-400 mt-1">{{ field.help_text }}</p>{% endif %}
      </div>
      {% endfor %}
      <div class="flex gap-3 pt-2">
        <button type="submit" class="inline-flex items-center gap-2 bg-emerald-600 hover:bg-emerald-700 text-white text-sm font-medium px-5 py-2 rounded-lg"><i data-lucide="save" class="w-4 h-4"></i> Save</button>
        <a href="{% url 'django_meta_whatsapp:apikey_list' %}" class="inline-flex items-center gap-2 bg-gray-100 hover:bg-gray-200 text-gray-700 text-sm font-medium px-5 py-2 rounded-lg">Cancel</a>
      </div>
    </form>
  </div>
</div>
{% endblock %}