<?php

declare(strict_types=1);

/**
 * Liste der Veranstaltungen, ganze Karte verlinkt auf die Detailseite. Props:
 *   $items      array aus data/veranstaltungen.json (bereits vorsortiert)
 *   $cta        string (optional, Default 'Ansehen') — Linktext auf der Karte
 *   $empty_text string (optional)
 *
 * EINE Kartenform für „Was ansteht" und „Rückblick" (Beschluss 30.07.2026):
 * Plakat links, Text rechts, volle Breite, untereinander gestapelt. Vorher war
 * der erste Eintrag breit und alles Weitere ein schmales Raster — zwei Formen
 * für dieselbe Sache, und der Rückblick sah dadurch nach Restposten aus.
 *
 * Vorschaubild ist das Hauptplakat (Hochformat). Fehlt es (die Seite entsteht ja
 * schon, bevor das Plakat fertig ist), greift das erste Galeriebild; ohne
 * beides bleibt die Karte reiner Text und bricht nicht.
 */
$items = $items ?? [];
$cta = $cta ?? 'Ansehen';
$emptyText = $empty_text ?? 'Aktuell keine Veranstaltungen.';

/** Erstes verfügbares Bild einer Veranstaltung (Hauptplakat vor Galerie). */
$vorschau = static function (array $v): ?array {
    return $v['plakate'][0] ?? $v['galerie'][0] ?? null;
};
?>
<?php if ($items === []): ?>
                <p class="text-muted"><?= e($emptyText) ?></p>
<?php else: ?>
                <ul class="veranstaltungen-cards__list">
<?php foreach ($items as $v): ?>
<?php
    $bild = $vorschau($v);
    $dateText = german_date_range((string) $v['date_start'], $v['date_end'] ?? null);
?>
                    <li>
                        <a class="veranstaltung-card" href="<?= e(url('veranstaltungen/' . $v['slug'])) ?>">
<?php if ($bild !== null): ?>
                            <div class="veranstaltung-card__media">
<?php component('img', [
    'image' => $bild,
    'sizes' => '(max-width: 768px) 100vw, 300px',
    'class' => 'veranstaltung-card__img',
]); ?>
                            </div>
<?php endif; ?>
                            <div class="veranstaltung-card__body">
                                <h3 class="veranstaltung-card__name"><?= e($v['title']) ?></h3>
                                <p class="veranstaltung-card__meta">
                                    <time datetime="<?= e($v['date_start']) ?>"><?= e($dateText) ?></time>
<?php if (!empty($v['location'])): ?>
                                    · <?= e($v['location']) ?>
<?php endif; ?>
                                </p>
<?php if (!empty($v['text'])): ?>
                                <p class="veranstaltung-card__text"><?= e($v['text']) ?></p>
<?php endif; ?>
                                <span class="veranstaltung-card__cta">
                                    <?= e($cta) ?> <?= icon('arrow-right', 'veranstaltung-card__arrow') ?>
                                </span>
                            </div>
                        </a>
                    </li>
<?php endforeach; ?>
                </ul>
<?php endif; ?>
