{% extends "base.html" %}
{% block title %}{{ serie.name }}{% endblock %}
{% block content %}
<a href="/series" style="color:var(--text-muted);text-decoration:none;font-size:0.9rem;">&larr; Tilbage til serier</a>

<h1 style="margin-top:12px;">📦 {{ serie.name }}</h1>
{% if serie.description %}
<p style="color:var(--text-muted);margin-bottom:16px;">{{ serie.description }}</p>
{% endif %}

<p style="font-size:0.85rem;color:var(--text-muted);margin-bottom:20px;">{{ serie.sets|length }} sæt</p>

<div class="card-grid">
    {% for s in serie.sets %}
    <a href="/sets/{{ s.code }}" class="card-set">
        <div class="card">
            <h3 style="margin-bottom:6px;">
                <span class="tag">{{ s.code }}</span>
                {{ s.name }}
            </h3>
            <p style="font-size:0.85rem;color:var(--text-muted);">
                {{ s.cards|length }} kort
            </p>
            {% if s.release_date %}
            <p style="font-size:0.8rem;color:var(--text-muted);margin-top:4px;">
                Udgivet: {{ s.release_date }}
            </p>
            {% endif %}
        </div>
    </a>
    {% endfor %}
</div>

{% if serie.sets|length == 0 %}
<div class="card" style="text-align:center;color:var(--text-muted);">
    <p>Ingen sæt i denne serie endnu.</p>
</div>
{% endif %}
{% endblock %}