{% extends "base.html" %}

{% block content %}
<div class="container">
    <article class="detail-page">
        <header class="detail-header">
            <h1>{{ page.meta.title }}</h1>
            {% if page.reading_time %}
            <div class="detail-meta">
                <span class="reading-time">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
                    {{ page.reading_time }} min read
                </span>
            </div>
            {% endif %}
        </header>
        <div class="content">
            {{ page.content|safe }}
        </div>
    </article>
</div>
{% endblock %}