{% extends "base.html" %}
{% block title %}Delete Certificate{% endblock %}
{% block nav_certificates %}active{% endblock %}

{% block content %}
<div class="page-header">
    <div>
        <a href="{% url 'portal:certificate_list' %}" class="text-muted small d-block mb-1">
            <i class="fa-solid fa-arrow-left me-1"></i> All Certificates
        </a>
        <h2>Delete Certificate</h2>
    </div>
</div>

<div class="row justify-content-center">
    <div class="col-lg-6">
        <div class="portal-card">
            <div class="portal-card-body">
                <div class="alert alert-danger mb-4">
                    <i class="fa-solid fa-triangle-exclamation me-2"></i>
                    This action cannot be undone.
                </div>
                <div class="info-grid mb-4">
                    <div class="info-item">
                        <span class="info-label">Student</span>
                        <span class="info-value fw-semibold">{{ cert.enrollment.student.get_full_name }}</span>
                    </div>
                    <div class="info-item">
                        <span class="info-label">Program</span>
                        <span class="info-value">{{ cert.enrollment.program.name }}</span>
                    </div>
                    <div class="info-item">
                        <span class="info-label">Level</span>
                        <span class="info-value">{{ cert.enrollment.program.get_level_display }}</span>
                    </div>
                    <div class="info-item">
                        <span class="info-label">Issue Date</span>
                        <span class="info-value">{{ cert.issue_date|date:"d M Y" }}</span>
                    </div>
                    {% if cert.certificate_number %}
                    <div class="info-item">
                        <span class="info-label">Certificate No.</span>
                        <span class="info-value">{{ cert.certificate_number }}</span>
                    </div>
                    {% endif %}
                </div>
                <form method="post">
                    {% csrf_token %}
                    <div class="d-flex gap-2">
                        <button type="submit" class="btn btn-danger">
                            <i class="fa-solid fa-trash me-1"></i> Delete
                        </button>
                        <a href="{% url 'portal:certificate_list' %}" class="btn btn-outline-secondary">Cancel</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endblock %}