{% extends "base.html" %}
{% block title %}Forside{% endblock %}
{% block content %}
<h1>⚡ Pokémon TCG serier</h1>
<p style="color:var(--text-muted);margin-bottom:24px;">{{ series|length }} serie(r) i databasen</p>

<div class="card-grid">
    {% for serie in series %}
    <a href="/series/{{ serie.name|urlencode }}" class="card-set">
        <div class="card">
            <h3 style="margin-bottom:6px;">📦 {{ serie.name }}</h3>
            <p style="font-size:0.85rem;color:var(--text-muted);">
                {{ serie.sets|length }} sæt
            </p>
            {% if serie.description %}
            <p style="font-size:0.85rem;color:var(--text-muted);margin-top:6px;">{{ serie.description }}</p>
            {% endif %}
        </div>
    </a>
    {% endfor %}
</div>

{% if series|length == 0 %}
<div class="card" style="text-align:center;color:var(--text-muted);">
    <p>Ingen serier i databasen endnu.</p>
</div>
{% endif %}
{% endblock %}