@php $ar = app()->getLocale() === 'ar'; @endphp
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
    @include('website.blocks._header')
    @if ($items->isEmpty())
        @include('website.blocks._empty')
    @else
        <div class="{{ $variant === 'masonry' ? 'columns-1 md:columns-2 lg:columns-3 gap-6 [&>*]:mb-6' : ($variant === 'carousel' ? 'flex gap-6 overflow-x-auto snap-x snap-mandatory pb-4' : 'grid gap-6 sm:grid-cols-2 lg:grid-cols-3') }}">
            @foreach ($items as $t)
                @php $content = $ar ? ($t->content ?? $t->content_en) : ($t->content_en ?? $t->content); @endphp
                <figure class="ec-stagger-item ec-surface rounded-2xl p-7 shadow-sm break-inside-avoid {{ $variant === 'carousel' ? 'snap-start shrink-0 w-80' : '' }}">
                    @if ($block->get('show_rating', true) && ($t->rating ?? null))
                        <div class="flex gap-0.5 mb-3 ec-accent" dir="ltr" aria-label="{{ $t->rating }}/5">
                            @for ($s = 1; $s <= 5; $s++)
                                <svg class="w-4 h-4 {{ $s <= $t->rating ? 'fill-current' : 'opacity-25 fill-current' }}" viewBox="0 0 20 20" aria-hidden="true">
                                    <path d="M10 1l2.6 5.3 5.9.9-4.2 4.1 1 5.8L10 14.4 4.7 17.1l1-5.8L1.5 7.2l5.9-.9z"/>
                                </svg>
                            @endfor
                        </div>
                    @endif
                    <blockquote class="ec-muted leading-relaxed">{{ $content }}</blockquote>
                    <figcaption class="flex items-center gap-3 mt-5">
                        @if ($block->get('show_avatar', true) && ($t->avatar_path ?? null))
                            <img src="{{ $t->avatar_path }}" alt="" loading="lazy" class="w-11 h-11 rounded-full object-cover">
                        @endif
                        <div class="min-w-0">
                            <p class="font-semibold text-sm">{{ $t->author_name ?? $t->name ?? '' }}</p>
                            @if ($t->author_role ?? null)
                                <p class="ec-muted text-xs">{{ $t->author_role }}</p>
                            @endif
                        </div>
                    </figcaption>
                </figure>
            @endforeach
        </div>
    @endif
    @include('website.blocks._footer_buttons')
</div>
