{% extends "base.html" %}
{% block title %}Scheduled — {{ config.APP_NAME }}{% endblock %}

{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
    <h2 class="mb-0"><i class="bi bi-clock-history"></i> Scheduled Posts</h2>
    <a href="{{ url_for('post.new_post') }}" class="btn text-light"
       style="background: linear-gradient(90deg, var(--tt-pink), var(--tt-cyan));">
        <i class="bi bi-plus-square"></i> New Post
    </a>
</div>

{% if posts %}
<div class="row g-3">
    {% for p in posts %}
    <div class="col-12">
        <div class="card bg-dark border-secondary post-card">
            <div class="card-body">
                <div class="d-flex justify-content-between align-items-start">
                    <div class="me-3">
                        <p class="mb-1">{{ p.title or '(no caption)' }}</p>
                        <span class="text-secondary small">
                            <i class="bi bi-clock"></i> {{ p.scheduled_at.strftime('%Y-%m-%d %H:%M UTC') }}
                            · <i class="bi bi-lock"></i> {{ p.privacy_level or 'draft' }}
                            · {{ 'file' if p.video_path else 'URL' }}
                        </span>
                        {% if p.status == 'failed' and p.error %}
                        <div class="alert alert-danger py-1 px-2 mt-2 mb-0 small">{{ p.error }}</div>
                        {% endif %}
                    </div>
                    <div class="d-flex gap-2 align-items-start">
                        {% if p.status == 'pending' %}
                        <span class="badge text-bg-secondary">Pending</span>
                        {% elif p.status == 'publishing' %}
                        <span class="badge text-bg-info">Publishing</span>
                        {% elif p.status == 'published' %}
                        <span class="badge text-bg-success">Published</span>
                        {% else %}
                        <span class="badge text-bg-danger">Failed</span>
                        {% endif %}

                        {% if p.status in ('pending', 'failed') %}
                        <form method="post" action="{{ url_for('post.reschedule', post_id=p.id) }}" class="d-flex gap-2">
                            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                            <input type="datetime-local" name="scheduled_at" class="form-control form-control-sm">
                            <button type="submit" class="btn btn-outline-secondary btn-sm">
                                <i class="bi bi-calendar-check"></i>
                            </button>
                        </form>
                        {% if p.status == 'failed' %}
                        <form method="post" action="{{ url_for('post.retry_scheduled', post_id=p.id) }}">
                            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                            <button type="submit" class="btn btn-outline-warning btn-sm">
                                <i class="bi bi-arrow-clockwise"></i> Retry
                            </button>
                        </form>
                        {% endif %}
                        {% endif %}

                        {% if p.status != 'publishing' %}
                        <form method="post" action="{{ url_for('post.delete_scheduled', post_id=p.id) }}"
                              onsubmit="return confirm('Delete this scheduled post?');">
                            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                            <button type="submit" class="btn btn-outline-danger btn-sm">
                                <i class="bi bi-trash"></i>
                            </button>
                        </form>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
    </div>
    {% endfor %}
</div>
{% else %}
<div class="text-center py-5">
    <i class="bi bi-clock-history text-secondary" style="font-size: 3rem;"></i>
    <h4 class="text-secondary mt-3">No scheduled posts</h4>
    <p class="text-secondary">TikTok's API has no scheduled publish — this app schedules for you and posts at the chosen time.</p>
</div>
{% endif %}
{% endblock %}