{% extends 'base.html' %}

{% block content %}
<div class="max-w-md mx-auto px-4 py-16">
  <div class="bg-white rounded-lg shadow-md overflow-hidden">
    <div class="px-6 py-5 bg-red-50 border-b border-red-100">
      <h1 class="text-lg font-bold text-red-800 flex items-center gap-2">
        <i class="fas fa-trash"></i> Delete Alert Profile
      </h1>
    </div>
    <div class="p-6">
      <p class="text-gray-700 mb-6">
        Delete alert profile <strong>{{ object.name }}</strong>?
        Its alerts history will also be removed.
      </p>
      <form method="post" class="flex gap-3">
        {% csrf_token %}
        <button type="submit" class="px-4 py-2 bg-red-600 text-white text-sm rounded-md hover:bg-red-700 font-medium">
          Yes, delete
        </button>
        <a href="{% url 'nginxmon-dashboard' %}" class="px-4 py-2 bg-gray-100 text-gray-700 text-sm rounded-md hover:bg-gray-200">
          Cancel
        </a>
      </form>
    </div>
  </div>
</div>
{% endblock %}