<!DOCTYPE html>

    {% include 'partials/head.html' %}
	{% include 'partials/header.html' %}
	{% include 'partials/video.html' %}

<div class="main-page">
    <div class="middle-content">
        <div class="body-content">
            <div class="title-content"><h1>{{ forum.name }}</h1></div>
            <div class="box-content">
                <div class="body-box-content">
                    {% include 'forum/_style.html' %}
                    <div class="forum-wrap">
                        <p class="desc" style="color:#b1997f">{{ forum.description }}</p>
                        <div class="forum-actions">
                            <a class="forum-btn" href="{% url 'app_forum' %}">← Volver al foro</a>
                            {% if forum_is_authenticated %}
                            <a class="forum-btn" href="{% url 'forum_create_topic' forum_id=forum.id %}">Crear nuevo tema</a>
                            {% endif %}
                        </div>

                        {% for topic in topics %}
                        <div class="topic-row">
                            <div class="main">
                                <a class="name" href="{% url 'forum_topic_p1' topic_id=topic.id %}">
                                    {% if topic.sticky %}<span class="forum-badge">Fijado</span>{% endif %}
                                    {% if topic.locked %}<span class="forum-badge">Bloqueado</span>{% endif %}
                                    {% if topic.moved %}<span class="forum-badge">Movido</span>{% endif %}
                                    {{ topic.name }}
                                </a>
                                <div class="desc">por {{ topic.display_poster }} · {{ topic.created }}</div>
                            </div>
                            <div class="meta">
                                <div>{{ topic.post_count }} respuestas{% if has_views %} · {{ topic.views }} vistas{% endif %}</div>
                                {% if topic.last_poster %}<div>último: {{ topic.last_poster }}</div>{% endif %}
                                {% if topic.last_time %}<div>{{ topic.last_time }}</div>{% endif %}
                            </div>
                        </div>
                        {% empty %}
                        <p>No hay temas todavía. ¡Sé el primero en publicar!</p>
                        {% endfor %}

                        {% if pagination.total_pages > 1 %}
                        <div class="forum-pagination">
                            {% if pagination.has_prev %}<a href="{% url 'forum_view' forum_id=forum.id page=pagination.prev_page %}">« Anterior</a>{% endif %}
                            {% for p in pagination.page_range %}
                                {% if p == pagination.page %}<span class="current">{{ p }}</span>
                                {% else %}<a href="{% url 'forum_view' forum_id=forum.id page=p %}">{{ p }}</a>{% endif %}
                            {% endfor %}
                            {% if pagination.has_next %}<a href="{% url 'forum_view' forum_id=forum.id page=pagination.next_page %}">Siguiente »</a>{% endif %}
                        </div>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

	{% include 'partials/social.html' %}
	{% include 'partials/footer.html' %}
	{% include 'partials/final.html' %}
