{% extends "base.html" %}

{% block title %}{{ post.title }} | {{ site.config.title }}{% endblock %}

{% block content %}
{% set has_sidebar = site.config.extra.author_profile | default(value=false) %}
{% set show_share = site.config.extra.post_share | default(value=true) %}
{% set show_related = site.config.extra.post_related | default(value=true) %}
{% set show_toc = site.config.extra.post_toc | default(value=true) %}
{% set show_breadcrumbs = site.config.extra.post_breadcrumbs | default(value=true) %}
<div class="{% if has_sidebar %}bamboo-sidebar-grid{% else %}max-w-3xl mx-auto{% endif %}">
    {% if has_sidebar %}
    <aside class="bamboo-sidebar">
        {% include "partials/author_profile.html" %}
    </aside>
    {% endif %}
    <article class="bamboo-main-column">
        {% if show_breadcrumbs %}{% include "partials/post_breadcrumbs.html" %}{% endif %}
        {% include "partials/post_header.html" %}
        {% include "partials/post_hero_image.html" %}
        {% if show_toc %}{% include "partials/post_toc.html" %}{% endif %}

        <div class="prose prose-lg dark:prose-invert
            prose-headings:text-gray-900 dark:prose-headings:text-white
            prose-p:text-gray-600 dark:prose-p:text-gray-300
            prose-li:text-gray-600 dark:prose-li:text-gray-300 prose-li:marker:text-gray-400 dark:prose-li:marker:text-gray-500
            prose-ol:text-gray-600 dark:prose-ol:text-gray-300
            prose-ul:text-gray-600 dark:prose-ul:text-gray-300
            prose-a:text-blue-500 dark:prose-a:text-blue-400 prose-a:no-underline hover:prose-a:underline
            prose-strong:text-gray-900 dark:prose-strong:text-white
            prose-code:text-emerald-600 dark:prose-code:text-emerald-400 prose-code:bg-gray-100 dark:prose-code:bg-gray-800 prose-code:px-1.5 prose-code:py-0.5 prose-code:rounded prose-code:before:content-none prose-code:after:content-none
            prose-pre:bg-gray-900 dark:prose-pre:bg-gray-950 prose-pre:border prose-pre:border-gray-200 dark:prose-pre:border-gray-700
            prose-blockquote:border-blue-500 prose-blockquote:text-gray-600 dark:prose-blockquote:text-gray-400
            prose-img:rounded-xl
            prose-table:text-gray-600 dark:prose-table:text-gray-300
            prose-th:bg-gray-100 dark:prose-th:bg-gray-800 prose-th:text-gray-900 dark:prose-th:text-white
            prose-td:border-gray-200 dark:prose-td:border-gray-700
            prose-hr:border-gray-200 dark:prose-hr:border-gray-700">
            {{ post.content | safe }}
        </div>

        {% if show_share %}{% include "partials/post_share.html" %}{% endif %}
        {% if show_related %}{% include "partials/post_related.html" %}{% endif %}

        <footer class="mt-12 pt-8 border-t border-gray-200 dark:border-gray-700">
            {% include "partials/post_prev_next.html" %}
            {% include "partials/post_edit_link.html" %}
            <a href="{{ site.config.base_url }}/" class="inline-flex items-center gap-2 text-gray-500 dark:text-gray-400 hover:text-blue-500 dark:hover:text-blue-400 font-medium transition-colors mt-6">
                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18" />
                </svg>
                Back to home
            </a>
        </footer>
    </article>
</div>
{% endblock %}