{% extends 'base.html.twig' %}

{% block title %}Overview · dmtools{% endblock %}

{% block body %}
    <h1 class="h3 mb-3">Overview</h1>

    {% set tiles = [
        { route: 'app_characters', icon: '🧝', label: 'Characters', blurb: 'The player characters' },
        { route: 'app_npcs',       icon: '🧑‍🌾', label: "NPC's", blurb: 'Villagers and other non-player characters' },
        { route: 'app_enemies',    icon: '👹', label: 'Enemies', blurb: 'Monster stat blocks' },
        { route: 'app_tracker',    icon: '⚔️', label: 'Tracker', blurb: 'Run encounters and track hit points' },
        { route: 'app_art',        icon: '🖼️', label: 'Art', blurb: 'Maps, handouts and character pieces' },
        { route: 'app_storyline',  icon: '📜', label: 'Storyline', blurb: 'Campaign notes and plot threads' },
    ] %}

    <div class="row row-cols-1 row-cols-sm-2 row-cols-lg-3 g-3">
        {% for t in tiles %}
            <div class="col">
                <a href="{{ path(t.route) }}"
                   class="card shadow-sm h-100 text-decoration-none text-body home-tile">
                    <div class="card-body d-flex align-items-start gap-3">
                        <div class="fs-1 lh-1">{{ t.icon }}</div>
                        <div>
                            <div class="h5 mb-1">{{ t.label }}</div>
                            <div class="text-body-secondary small">{{ t.blurb }}</div>
                        </div>
                    </div>
                </a>
            </div>
        {% endfor %}
    </div>
{% endblock %}