{% extends 'base.html' %}

{% block title %}Delete Post — WildWatch{% endblock %}

{% block content %}
<div class="container py-lg" style="max-width:480px; text-align:center;">
  <div style="font-size:3rem; margin-bottom:20px;">🗑️</div>
  <h2 style="font-family:var(--font-display); margin-bottom:12px;">Delete this post?</h2>
  <p style="color:var(--text-muted); margin-bottom:8px; line-height:1.65;">
    This action cannot be undone. The photo and all its comments and likes will be permanently removed.
  </p>

  <div style="background:var(--bg-secondary); border-radius:var(--radius-md); overflow:hidden; margin:24px 0;">
    <img src="{{ post.image.url }}" alt="" style="width:100%; height:180px; object-fit:cover;">
    <div style="padding:14px 16px; text-align:left;">
      <p style="font-size:0.88rem; color:var(--text-secondary);">{{ post.caption|truncatechars:100 }}</p>
    </div>
  </div>

  <div class="flex-center gap-3">
    <a href="{% url 'feed' %}" class="btn-secondary">Cancel</a>
    <form method="post">
      {% csrf_token %}
      <button type="submit" style="background:linear-gradient(135deg,#c62828,#ef5350); color:white; border:none; padding:12px 28px; border-radius:var(--radius-pill); font-weight:600; cursor:pointer; font-size:0.9rem;">
        <i class="fa-solid fa-trash me-1"></i> Yes, Delete
      </button>
    </form>
  </div>
</div>
{% endblock %}