{% extends "base.html" %}
{% block title %}Forum Thread — {{ project.name }} — Fossilrepo{% endblock %}

{% block content %}
<h1 class="text-2xl font-bold text-gray-100 mb-2">{{ project.name }}</h1>
{% include "fossil/_project_nav.html" %}

<div class="mb-4">
  <a href="{% url 'fossil:forum' slug=project.slug %}" class="text-sm text-brand-light hover:text-brand">&larr; Back to forum</a>
</div>

<div class="space-y-3">
  {% for item in posts %}
  <div class="rounded-lg bg-gray-800 border border-gray-700 {% if item.post.in_reply_to %}ml-8{% endif %}">
    <div class="px-5 py-4">
      <div class="flex items-center justify-between mb-2">
        {% if is_django_thread %}
        <span class="text-sm font-medium text-gray-200">{{ item.post.user }}</span>
        {% else %}
        <a href="{% url 'fossil:user_activity' slug=project.slug username=item.post.user %}" class="text-sm font-medium text-gray-200 hover:text-brand-light">{{ item.post.user }}</a>
        {% endif %}
        <span class="text-xs text-gray-500">{{ item.post.timestamp|timesince }} ago</span>
      </div>
      {% if item.post.title and forloop.first %}
      <h2 class="text-lg font-semibold text-gray-100 mb-3">{{ item.post.title }}</h2>
      {% endif %}
      {% if item.body_html %}
      <div class="prose prose-invert prose-sm prose-gray max-w-none">
        {{ item.body_html }}
      </div>
      {% else %}
      <p class="text-sm text-gray-500 italic">{{ item.post.title|default:"(empty)" }}</p>
      {% endif %}
    </div>
  </div>
  {% empty %}
  <p class="text-sm text-gray-500 py-8 text-center">No posts in this thread.</p>
  {% endfor %}
</div>

{% if has_write and is_django_thread %}
<div class="mt-6">
  <h3 class="text-sm font-semibold text-gray-300 mb-3">Reply</h3>
  <form method="post" action="{% url 'fossil:forum_reply' slug=project.slug post_id=thread_uuid %}" class="space-y-3 rounded-lg bg-gray-800 p-5 border border-gray-700">
    {% csrf_token %}
    <textarea name="body" rows="6" required placeholder="Write your reply in Markdown..."
              class="w-full rounded-md border-gray-700 bg-gray-900 text-gray-100 shadow-sm focus:border-brand focus:ring-brand sm:text-sm font-mono"></textarea>
    <div class="flex justify-end">
      <button type="submit" class="rounded-md bg-brand px-4 py-2 text-sm font-semibold text-white shadow-sm hover:bg-brand-hover">
        Post Reply
      </button>
    </div>
  </form>
</div>
{% endif %}
{% endblock %}