@php
// Switched off in Admin -> Pages: the band does not draw, on any layout that includes it.
if (!section_on('popular-dishes')) { return; }

/**
 * Popular dishes — a tall promo (or paid box ad) beside a grid of popular menu items.
 * @var array  $popular  menu-item rows
 * @var string $cols     Bootstrap column classes per dish card (default 4-up on lg)
 * @var int    $limit    how many dishes to show (default 8)
 * @var string $rowClass extra classes on the dish grid row (e.g. row-cols-lg-5 with $cols='col')
 */
$popular = collect($popular ?? [])->all();   // accepts an array or a collection
if (empty($popular)) {
    echo partial('sections/band-empty', ['eyebrow' => t('home.popular_eyebrow'), 'title' => t('home.popular'), 'icon' => 'fa-utensils', 'msg' => t('home.empty_dishes')]);
    return;
}
$cols     = $cols ?? 'col-lg-3 col-sm-6';
$limit    = (int) ($limit ?? 8);
$rowClass = $rowClass ?? '';
@endphp
<section class="qm-section pt-0 qm-popular-section">
    <div class="container-fluid">
        <div class="qm-rail-head" data-reveal>
            <div>
                <span class="qm-eyebrow">{{ t_raw('home.popular_eyebrow') }}</span>
                <h2 class="qm-section-title">{{ t_raw('home.popular') }}</h2>
                <p class="qm-section-sub">{{ t_raw('home.popular_sub') }}</p>
            </div>
            <a href="{{ route('restaurants', ['sort' => 'rating']) }}" class="qm-btn qm-btn-sm qm-btn-outline">{{ t_raw('common.view_all') }}</a>
        </div>
        <div class="row g-4" data-reveal>
            @php /* AN UNSOLD SLOT BECOMES MORE DISHES, AT THE SAME CARD SIZE.
                      Sold, this is a quarter-width ad beside four dishes per row. Unsold, it used
                      to show the theme's fallback image — a quarter of the band advertising
                      nothing. Simply dropping the column is not the answer either: the dish grid
                      would stretch to full width and every card would grow.

                      So the row goes five-up across the whole width instead of four-up across
                      three-quarters, which is the SAME card width, and the freed quarter is paid
                      for with two more dishes (one per row) rather than left empty. */
                   $ad = active_ad('home_box');
                   $perRow  = $ad ? 4 : 5;
                   $rows    = 2;
                   $dishes  = collect($popular)->take($ad ? $limit : min(count($popular), $perRow * $rows))->all();
                   $gridCls = $ad ? $cols : 'col';
                   $gridRow = $ad ? $rowClass : 'row-cols-lg-5 row-cols-sm-2';
@endphp
            @if ($ad)
            <div class="col-lg-3 col-md-4">
                @partial('cards/ad', ['ad' => $ad, 'variant' => 'box'])
            </div>
            @endif
            <div class="{{ $ad ? 'col-lg-9 col-md-8' : 'col-12' }}">
                <div class="row g-4 qm-stagger{!! $gridRow !== '' ? ' ' . e($gridRow) : '' !!}">
                    @foreach ($dishes as $item)
                    <div class="{{ $gridCls }}" data-reveal>@partial('cards/popular-dish', ['item' => $item])</div>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
</section>