{% extends "base.html" %}
{% block title %}{{ post.title }} — {{ site_display_name() }}{% endblock %}

{% block head_extra %}
  {% if post.meta_keywords %}
    <meta name="keywords" content="{{ post.meta_keywords|e }}">
  {% endif %}
  {% if post.published_at_utc %}
    <meta property="article:published_time" content="{{ post.published_at_utc.strftime('%Y-%m-%dT%H:%M:%SZ')|e }}" />
  {% endif %}
{% endblock %}

{% block content %}
<div class="container px-3 px-md-4 py-4 py-md-5">
  <article class="row justify-content-center">
    <div class="col-lg-9 col-xl-8">
      <nav class="mb-4">
        <a href="/" class="text-decoration-none text-secondary small fw-semibold">
          ← {{ t('home.postPage.backToBlog') if t else 'Înapoi la articole' }}
        </a>
      </nav>
      <div class="mb-3 d-flex flex-wrap align-items-center gap-3">
        {% if post.category and post.category.lower() not in ['none', 'null', 'uncategorized', ''] %}
          <span class="lumina-badge">{{ post.category }}</span>
        {% endif %}
        {% if post.author_name %}
          <span class="text-secondary small fw-medium">✍️ {{ post.author_name }}</span>
        {% endif %}
        {% if post.published_at %}
          <span class="text-secondary small">• 📅 {{ post.published_at.strftime("%d.%m.%Y") }}</span>
        {% endif %}
        {% if post.draft %}
          <span class="badge bg-warning text-dark">Draft</span>
        {% endif %}
        {% if post_header_meta_html %}{{ post_header_meta_html | safe }}{% endif %}
      </div>
      <h1 class="article-title mb-4">{{ post.title }}</h1>
      {% if post.hero_image_url %}
      <div class="mb-5 overflow-hidden rounded-4 shadow-sm border">
        <img src="{{ post.hero_image_url }}" alt="{{ post.title }}" class="w-100 object-fit-cover" style="max-height: 480px;">
      </div>
      {% endif %}
      {% if plugin_area_article_header %}
      <div class="mb-4">{{ plugin_area_article_header | safe }}</div>
      {% endif %}
      {% if post.excerpt %}
      <div class="article-excerpt mb-4">{{ post.excerpt }}</div>
      {% endif %}
      <div class="article-body mb-5">{{ post.content_html | safe }}</div>
      {% if plugin_area_article_footer %}
      <div class="my-4">{{ plugin_area_article_footer | safe }}</div>
      {% endif %}
      {% if post_article_footer_html %}
      <div class="my-4">{{ post_article_footer_html | safe }}</div>
      {% endif %}
    </div>
  </article>
</div>
{% endblock %}