{% extends "base.html" %}
{% block title %}Notifications — AgriLink{% endblock %}

{% block content %}
<div class="page-container">
    <h2>Your Notifications</h2>

    {% if notifications %}
        <ul class="notification-list">
            {% for n in notifications %}
            <li class="notification-item {% if not n.is_read %}unread{% endif %}">
                <div class="notif-message">{{ n.message }}</div>
                <div class="notif-meta">
                    {{ n.created_at.strftime('%d %b %Y %H:%M') }}
                </div>
            </li>
            {% endfor %}
        </ul>
    {% else %}
        <p>You have no notifications at the moment.</p>
    {% endif %}

    <!-- Navigation buttons so the buyer never needs the browser back arrow -->
    <div style="margin-top: 25px; display: flex; gap: 12px; flex-wrap: wrap;">
        <a href="{{ url_for('buyer_dashboard') }}" class="btn-primary">
            Back to Dashboard
        </a>

        <a href="{{ url_for('buyer_orders') }}" class="btn-primary">
            View Order History
        </a>
    </div>
</div>
{% endblock %}