<?php

declare(strict_types=1);

/**
 * Trainings-/Spielort-„Dashboard" als Bento-Grid. Props:
 *   $training  array{sessions: [{day, time}], venue_from_club?: bool, note?: string}
 *   $highlight array{label, value} (optional) — kleiner Akzent-Tile (z. B. Spielklasse).
 *   $anchor    string (optional, Default 'training')
 * Spielort kommt aus data/club.json (NAP-Single-Source). Ohne Daten: nichts.
 */
$anchor = $anchor ?? 'training';
$sessions = $training['sessions'] ?? [];
$showVenue = !empty($training['venue_from_club']);
$highlight = $highlight ?? null;

if ($sessions === [] && !$showVenue) {
    return;
}

$club = json_load('club');
$addr = $club['address'] ?? [];
$mapsQuery = rawurlencode(trim(($addr['venue'] ?? '') . ', ' . ($addr['street'] ?? '') . ', ' . ($addr['zip'] ?? '') . ' ' . ($addr['city'] ?? ''), ', '));
?>
        <section class="section training" id="<?= e($anchor) ?>">
            <div class="container">
                <div class="bento">
                    <article class="bento__tile bento__tile--times">
                        <h2 class="bento__heading"><?= icon('clock', 'bento__hicon') ?>Trainingszeiten</h2>
<?php if ($sessions !== []): ?>
                        <ul class="bento__sessions">
<?php foreach ($sessions as $s): ?>
                            <li>
                                <span class="bento__day"><?= e($s['day']) ?></span>
                                <span class="bento__time"><?= e($s['time']) ?></span>
                            </li>
<?php endforeach; ?>
                        </ul>
<?php else: ?>
                        <p class="text-muted">Die genauen Trainingszeiten erfährst du direkt bei unserem Ansprechpartner.</p>
<?php endif; ?>
<?php if (!empty($training['note'])): ?>
                        <p class="bento__note text-muted"><?= e($training['note']) ?></p>
<?php endif; ?>
                        <span class="bento__deco" aria-hidden="true"><?= icon('clock') ?></span>
                    </article>

<?php if ($showVenue && $addr !== []): ?>
                    <article class="bento__tile bento__tile--venue">
                        <h2 class="bento__heading"><?= icon('geo-alt', 'bento__hicon') ?>Spielort</h2>
                        <p class="bento__address">
<?php if (!empty($addr['venue'])): ?><strong><?= e($addr['venue']) ?></strong><br><?php endif; ?>
                            <?= e($addr['street']) ?><br>
                            <?= e($addr['zip']) ?> <?= e($addr['city']) ?>
                        </p>
                        <span class="bento__deco" aria-hidden="true"><?= icon('geo-alt') ?></span>
                    </article>

                    <article class="bento__tile bento__tile--route">
                        <span class="bento__route-label">Anfahrt</span>
                        <a class="btn btn--outline" href="https://www.google.com/maps/search/?api=1&amp;query=<?= e($mapsQuery) ?>" target="_blank" rel="noopener">Route planen<span class="visually-hidden"> (öffnet Google Maps in neuem Tab)</span></a>
                    </article>
<?php endif; ?>

<?php if ($highlight !== null && ($highlight['value'] ?? '') !== ''): ?>
                    <article class="bento__tile bento__tile--accent">
                        <span class="bento__stat-label"><?= e($highlight['label'] ?? '') ?></span>
                        <span class="bento__stat-value"><?= e($highlight['value']) ?></span>
                    </article>
<?php endif; ?>
                </div>
            </div>
        </section>
