{% extends "base.html" %}
{% block title %}الرسائل{% endblock %}
{% block content %}
<h2 class="mb-4">الرسائل</h2>
{% for msg in messages %}
<div class="card mb-3 fade-in">
  <div class="card-body">
    <div class="d-flex justify-content-between">
      <h5 class="card-title">{{ msg.name }}</h5>
      <span class="badge {% if msg.read %}bg-success{% else %}bg-warning{% endif %}">
        {% if msg.read %}مقروءة{% else %}جديدة{% endif %}
      </span>
    </div>
    <p class=" ">{{ msg.subject or 'بدون موضوع' }}</p>
    <p class="card-text">{{ msg.body }}</p>
    <div class="mt-2">
      {% if not msg.read %}
        <a href="{{ url_for('mark_message_read', id=msg.id) }}" class="btn btn-sm btn-outline-success">وضع كمقروءة</a>
      {% endif %}
      <a href="{{ url_for('delete_message', id=msg.id) }}" class="btn btn-sm btn-outline-danger" data-confirm-delete="message">حذف</a>    </div>
  </div>
</div>
{% else %}
<p class="text-center  ">لا توجد رسائل.</p>
{% endfor %}
{% endblock %}