{% sw_extends '@Storefront/storefront/base.html.twig' %}

{% block base_content %}
    {% set post = page.post %}
    <div class="container rm-page">
        <p class="rm-back"><a href="{{ path('frontend.riccardo.magazine.list') }}">← Zum Magazin</a></p>

        <article class="rm-article">
            <header class="rm-article-head">
                <div class="rm-card-meta">
                    {% if post.publishedAt %}<time datetime="{{ post.publishedAt|date('Y-m-d') }}">{{ post.publishedAt|format_date('long', locale: 'de-DE', timezone: 'Europe/Berlin') }}</time>{% endif %}
                    {% if post.readingMinutes %}<span>{{ post.readingMinutes }} Min. Lesezeit</span>{% endif %}
                    {% if post.author %}<span>{{ post.author }}</span>{% endif %}
                </div>
                <h1>{{ post.title }}</h1>
                {% if post.categories is not empty %}
                    <div class="rm-card-cats">
                        {% for cat in post.categories %}
                            <a href="{{ path('frontend.riccardo.magazine.category', { slug: cat.slug }) }}">{{ cat.name }}</a>
                        {% endfor %}
                    </div>
                {% endif %}
            </header>

            {% if post.media %}
                <figure class="rm-article-media">
                    {% sw_include '@Storefront/storefront/utilities/thumbnail.html.twig' with {
                        media: post.media,
                        attributes: { class: 'rm-article-img', alt: post.title }
                    } %}
                </figure>
            {% endif %}

            {% if post.teaser %}<p class="rm-article-teaser">{{ post.teaser|striptags }}</p>{% endif %}

            <div class="rz-prose rm-article-body">{{ post.content|raw }}</div>
        </article>

        {% if page.related is not empty %}
            <section class="rm-related" aria-labelledby="rm-related-title">
                <h2 id="rm-related-title">Weitere Beiträge</h2>
                <div class="rm-grid">
                    {% for related in page.related %}
                        {% sw_include '@RiccardoMagazine/storefront/riccardo-magazine/post-card.html.twig' with { post: related } %}
                    {% endfor %}
                </div>
            </section>
        {% endif %}
    </div>

    {% block riccardo_magazine_structured_data %}
        <script type="application/ld+json">
            {{ {
                '@context': 'https://schema.org',
                '@type': 'Article',
                headline: post.title,
                datePublished: post.publishedAt ? post.publishedAt|date('c') : null,
                dateModified: post.updatedAt ? post.updatedAt|date('c') : (post.publishedAt ? post.publishedAt|date('c') : null),
                description: post.metaDescription ?: (post.teaser ? post.teaser|striptags|slice(0, 300) : null),
                image: post.media ? post.media.url : null,
                author: { '@type': 'Organization', name: 'Riccardo Onlinestore GmbH' },
                publisher: { '@type': 'Organization', name: 'Riccardo – Elektrische Zigaretten' },
                mainEntityOfPage: url('frontend.riccardo.magazine.detail', { slug: post.slug })
            }|filter(v => v is not null)|json_encode(constant('JSON_UNESCAPED_SLASHES') b-or constant('JSON_UNESCAPED_UNICODE'))|raw }}
        </script>
    {% endblock %}
{% endblock %}