<?php
/**
 * Shared step indicator for the New Booking wizard — redesigned to match
 * a user-supplied 8-panel mockup (Search Availability -> Select Room ->
 * Guest Details -> Reservation Details -> Add Services -> Payment ->
 * Confirmation; "All Reservations" and "Reservation Details (View)" in
 * that mockup are separate pages, not wizard steps, so they're not
 * numbered here). Included (not extended) from each step with $step set
 * to 1-7, so every step stays visually identical instead of drifting if
 * edited separately.
 */
$steps = [
    1 => 'Search Dates',
    2 => 'Select Room',
    3 => 'Guest Details',
    4 => 'Reservation Details',
    5 => 'Add Services',
    6 => 'Payment',
    7 => 'Confirmation',
];
?>
<div class="wizard-steps flex-wrap">
    <?php foreach ($steps as $num => $label): ?>
        <div class="step-badge <?= $num < $step ? 'done' : ($num === $step ? 'active' : '') ?>">
            <?= $num < $step ? '<i class="bi bi-check"></i>' : $num ?>
        </div>
        <span class="step-label <?= $num === $step ? 'active' : '' ?>"><?= esc($label) ?></span>
        <?php if ($num < count($steps)): ?><div class="step-line"></div><?php endif; ?>
    <?php endforeach; ?>
</div>
