{% extends "base.html" %}
{% load civic_tags %}
{% block content %}
{% include "partials/page_hero.html" with eyebrow=activity.category title=activity.title description=activity.summary crumbs=meta.crumbs %}
<article class="container-x grid gap-10 py-14 lg:grid-cols-[1.4fr_1fr]">
  <div class="space-y-5 leading-relaxed text-forest/85">
    <img src="{% image activity.image %}" alt="{{ activity.title }}" class="w-full rounded-3xl object-cover">
    {% for para in activity.body %}<p>{{ para }}</p>{% endfor %}
  </div>
  <aside class="space-y-5">
    <div class="card-surface rounded-3xl p-6">
      <h2 class="font-bold text-forest">প্রভাব</h2>
      <ul class="mt-4 space-y-3">{% for i in activity.impact %}<li class="flex items-start gap-2 text-sm"><span class="text-emerald">✓</span> {{ i }}</li>{% endfor %}</ul>
    </div>
    <p class="text-sm text-muted">{{ activity.date|bn_date }} · {{ activity.location }} · ওয়ার্ড {{ activity.ward|bn }}</p>
    {% if related %}
    <div><h2 class="font-bold text-forest">সংশ্লিষ্ট কার্যক্রম</h2>
      <ul class="mt-3 space-y-2">{% for r in related %}<li><a href="{% url 'core:activity-detail' r.id %}" class="text-sm font-semibold text-forest underline-offset-4 hover:underline">{{ r.title }}</a></li>{% endfor %}</ul></div>
    {% endif %}
  </aside>
</article>
{% endblock %}