<!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>Foro de la comunidad</h1></div>
            <div class="box-content">
                <div class="body-box-content">
                    {% include 'forum/_style.html' %}
                    <div class="forum-wrap">
                        <form class="forum-search" action="{% url 'forum_search' %}" method="GET" style="margin-bottom:16px">
                            <input type="text" name="q" placeholder="Buscar en el foro..."
                                   style="width:70%;background:rgba(0,0,0,.3);color:#e8e0d0;border:1px solid rgba(215,150,2,.4);padding:8px;border-radius:3px">
                            <button type="submit" class="forum-btn">Buscar</button>
                        </form>
                        {% for category in categories %}
                        <div class="forum-cat">
                            <div class="forum-cat-title">{{ category.name }}</div>
                            {% for forum in category.forums %}
                            <div class="forum-row {% if forum.deleted %}forum-deleted{% endif %}">
                                <div class="main">
                                    <a class="name" href="{% url 'forum_view_p1' forum_id=forum.id %}"
                                       {% if forum.colortitle and forum.colortitle != '0' %}style="color:{{ forum.colortitle }}"{% endif %}>
                                        {{ forum.name }}
                                    </a>
                                    {% if not forum.visibility %}<span class="forum-badge">Oculto</span>{% endif %}
                                    <div class="desc">{{ forum.description }}</div>
                                </div>
                                <div class="stats">
                                    <div>{{ forum.topic_count }} temas</div>
                                    <div>{{ forum.post_count }} mensajes</div>
                                    {% if forum.last_topic_name %}
                                    <div>Último: <a href="{% url 'forum_topic_p1' topic_id=forum.last_topic_id %}">{{ forum.last_topic_name|truncatechars:30 }}</a></div>
                                    {% endif %}
                                </div>
                            </div>
                            {% endfor %}
                        </div>
                        {% empty %}
                        <p>Todavía no hay foros disponibles.</p>
                        {% endfor %}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

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