<div class="page-heading compact">
    <div>
        <span>Модул 11</span>
        <h1>Statistics</h1>
        <p>Национални, общински, институционални и категорийни показатели с интерактивни графики.</p>
    </div>
</div>

<section class="stat-grid">
    <?php foreach ($overview as $stat): ?>
        <article class="metric-card">
            <span class="metric-icon <?= e($stat['tone']) ?>"><i class="bi <?= e($stat['icon']) ?>"></i></span>
            <div>
                <small><?= e($stat['label']) ?></small>
                <strong><?= e($stat['value']) ?></strong>
                <em><?= e($stat['trend']) ?></em>
            </div>
        </article>
    <?php endforeach; ?>
</section>

<section class="dashboard-grid">
    <article class="panel span-6">
        <h2>По общини</h2>
        <canvas height="220" data-chart="bar" data-labels='<?= e(json_encode(array_column($municipalities, 'name'), JSON_UNESCAPED_UNICODE)) ?>' data-values='<?= e(json_encode(array_column($municipalities, 'count'))) ?>'></canvas>
    </article>
    <article class="panel span-6">
        <h2>По категории</h2>
        <canvas height="220" data-chart="doughnut" data-labels='<?= e(json_encode(array_column($categories, 'name'), JSON_UNESCAPED_UNICODE)) ?>' data-values='<?= e(json_encode(array_column($categories, 'count'))) ?>'></canvas>
    </article>
</section>
