{% extends "base.html" %}

{% block content %}
<div class="row mb-4 align-items-center">
    <div class="col-md-8">
        <h1>Email Campaigns</h1>
        <p class="text-muted">Re-engage your guests with personalized offers and updates.</p>
    </div>
    <div class="col-md-4 text-md-end">
        <a href="/admin/core/campaign/add/" class="btn btn-primary">+ Create Campaign</a>
    </div>
</div>

{% if messages %}
<div class="row">
    <div class="col-12">
        {% for message in messages %}
        <div class="alert alert-{{ message.tags }} alert-dismissible fade show" role="alert">
            {{ message }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
        {% endfor %}
    </div>
</div>
{% endif %}

<div class="row g-4">
    {% for campaign in campaigns %}
    <div class="col-md-6">
        <div class="card p-4">
            <div class="d-flex justify-content-between align-items-start mb-3">
                <div>
                    <h5 class="mb-1">{{ campaign.title }}</h5>
                    <small class="text-muted">Subject: {{ campaign.subject }}</small>
                </div>
                {% if campaign.status == 'sent' %}
                <span class="badge bg-success">Sent</span>
                {% else %}
                <span class="badge bg-warning text-dark">Draft</span>
                {% endif %}
            </div>
            <p class="text-truncate text-muted small mb-4">{{ campaign.body|striptags }}</p>
            <div class="d-flex justify-content-between align-items-center">
                <small class="text-muted">
                    {% if campaign.status == 'sent' %}
                    Sent on {{ campaign.sent_at|date:"M d, Y" }}
                    {% else %}
                    Created {{ campaign.created_at|date:"M d, Y" }}
                    {% endif %}
                </small>
                <div class="btn-group">
                    <a href="/admin/core/campaign/{{ campaign.id }}/change/" class="btn btn-sm btn-outline-secondary">Edit</a>
                    {% if campaign.status == 'draft' %}
                    <a href="{% url 'send_campaign' campaign.id %}" class="btn btn-sm btn-primary" onclick="return confirm('Are you sure you want to send this campaign to all guests?')">Send Now</a>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
    {% empty %}
    <div class="col-12">
        <div class="card p-5 text-center text-muted">
            <p>No campaigns yet. Launch your first loyalty offer today!</p>
            <div>
                <a href="/admin/core/campaign/add/" class="btn btn-primary">+ Create First Campaign</a>
            </div>
        </div>
    </div>
    {% endfor %}
</div>
{% endblock %}