{% extends 'base.html.twig' %}

{% block title %}{{ case.victimName }} — {{ 'nav.stories'|trans }}{% endblock %}

{% block body %}
    <section class="article-hero">
        <div class="container">
            <p class="kicker" style="color: var(--red-light); text-transform: uppercase; letter-spacing: 3px; font-weight: 700; font-size: .85rem;">{{ 'story.kicker'|trans }}</p>
            <h1>{{ case.victimName }}{% if case.victimAge %}, {{ case.victimAge }} {{ 'common.age_suffix'|trans }}{% endif %}</h1>
            <div class="article-meta">
                <span>📍 {{ case.location }}</span>
                {% if case.incidentDate %}<span>🗓️ {{ case.incidentDate|date('d/m/Y') }}</span>{% endif %}
            </div>
        </div>
    </section>

    <section class="section">
        <div class="container">
            {% if case.imageName %}
                <img class="article-cover" src="{{ vich_uploader_asset(case, 'imageFile') }}" alt="{{ case.victimName }}">
            {% endif %}

            <div class="article-body">
                {{ case.getLocalizedStoryContent(app.request.locale)|nl2br }}
            </div>

            <br>
            <a href="{{ path('app_stories') }}" class="btn btn-outline"><span class="dir-arrow">←</span> {{ 'stories.back_all'|trans }}</a>
        </div>
    </section>
{% endblock %}