{% extends "base.html" %}
{% block title %}Delete {{ group.name }} — Fossilrepo{% endblock %}

{% block content %}
<div class="mb-6">
  <a href="{% url 'projects:group_detail' slug=group.slug %}" class="text-sm text-brand-light hover:text-brand">&larr; Back to {{ group.name }}</a>
</div>

<div class="mx-auto max-w-lg">
  <div class="rounded-lg bg-gray-800 p-6 shadow border border-gray-700">
    <h2 class="text-lg font-semibold text-gray-100">Delete Group</h2>
    <p class="mt-2 text-sm text-gray-400">
      Are you sure you want to delete <strong class="text-gray-100">{{ group.name }}</strong>? Projects in this group will be unlinked but not deleted.
    </p>
    <form method="post" class="mt-6 flex justify-end gap-3">
      {% csrf_token %}
      <a href="{% url 'projects:group_detail' slug=group.slug %}"
         class="rounded-md bg-gray-700 px-4 py-2 text-sm font-semibold text-gray-100 shadow-sm ring-1 ring-inset ring-gray-600 hover:bg-gray-600">
        Cancel
      </a>
      <button type="submit"
              class="rounded-md bg-red-600 px-4 py-2 text-sm font-semibold text-white shadow-sm hover:bg-red-500">
        Delete
      </button>
    </form>
  </div>
</div>
{% endblock %}