{% extends "base.html" %}
{% block title %}Manage Tags — IslamInLife Quran App{% endblock %}
{% block body %}
<header>
  <h1>🏷️ Manage Tags</h1>
  <div><a href="{{ url_for('fsr_checkin') }}">FSR Check-In</a> &nbsp;·&nbsp; <a href="{{ url_for('home') }}">Home</a></div>
</header>
<main>
  {% if error %}<div class="msg msg-error">{{ error }}</div>{% endif %}

  <div class="card">
    <form method="post">
      <label>New Tag Name</label>
      <input type="text" name="name" placeholder="e.g. Akhira, Prophets, Salat" required>
      <button type="submit" class="btn-save">+ Add Tag</button>
    </form>
  </div>

  {% for t in tags %}
  <div class="card" id="tag_{{ t.id }}" style="display:flex; justify-content:space-between; align-items:center;">
    <div>{{ t.tag_name }}</div>
    <a href="#" onclick="deleteTag({{ t.id }}); return false;" style="font-size:13px; color:#a93226;">Delete</a>
  </div>
  {% endfor %}
</main>

<script>
function deleteTag(id) {
  if (!confirm('Delete this tag? If any lessons use it, it will be removed from them too.')) return;
  fetch(`/api/fsr/tags/${id}/delete`, { method: 'POST' })
    .then(r => r.json())
    .then(d => {
      if (d.ok) location.reload();
      else alert(d.error || 'Could not delete.');
    });
}
</script>
{% endblock %}