{% extends "base.html" %}
{% block title %}{{ artifact.name }} — df-storyteller{% endblock %}

{% block content %}
<div style="margin-bottom: 1rem;">
    <a href="/lore" style="color: var(--parchment-dark); text-decoration: none;">&larr; Back to Legends</a>
</div>

<div class="parchment">
    <div class="char-sheet">
        <div class="char-header">
            <div class="char-name">{{ artifact.name }}</div>
        </div>

        <div class="stat-section">
            {% if artifact.item_type %}
            <h3>Type</h3>
            <p>{{ artifact.item_type }}</p>
            {% endif %}

            {% if artifact.material %}
            <h3>Material</h3>
            <p>{{ artifact.material }}</p>
            {% endif %}

            {% if creator_name %}
            <h3>Creator</h3>
            <p>{{ lore_link("figure", creator_id, creator_name) | safe }}</p>
            {% endif %}

            {% if site_name %}
            <h3>Location</h3>
            <p>{{ lore_link("site", site_id, site_name) | safe }}</p>
            {% endif %}
        </div>

        {% if artifact.description %}
        <div class="bio-section">
            <h3>Description</h3>
            <p style="color: var(--ink-light); line-height: 1.7;">{{ artifact.description }}</p>
        </div>
        {% endif %}

        {% if pages %}
        <div class="bio-section">
            <h3>Contents</h3>
            <p style="color: var(--ink-faded); font-size: 0.9rem; margin-bottom: 0.5rem;">This work contains {{ pages | length }} page{{ 's' if pages | length != 1 else '' }}:</p>
            <ul class="stat-list">
                {% for page in pages %}
                <li>
                    Page {{ page.page_number }}: <strong>{{ page.title }}</strong>
                    {% if page.wc_type %}<span style="color: var(--ink-faded);"> ({{ page.wc_type }})</span>{% endif %}
                </li>
                {% endfor %}
            </ul>
        </div>
        {% endif %}
    </div>
</div>
{% endblock %}