@extends('frontend.layouts.app')

@section('title', $title)
@section('description', $description)

@section('content')
    @php
        $assetPath = fn (string $path) => asset('frontend/' . ltrim($path, '/'));
    @endphp

    @include('frontend.layouts.breadcrumb', ['title' => 'Gallery'])

    <div class="tv-gallery-section style-2 space bg-light">
        <div class="container">
            <div class="row gy-30">
                @forelse($galleries as $gallery)
                    @php
                        $sizeClass = match($loop->iteration % 7) {
                            4, 5 => 'col-lg-6 col-md-6 col-sm-6',
                            0 => 'col-lg-8 col-md-6 col-sm-6',
                            default => 'col-lg-4 col-md-6 col-sm-6',
                        };
                    @endphp
                    <div class="{{ $sizeClass }}">
                        <div class="gallery-single-box">
                            <div class="gallery-thumb cms-frame cms-frame--gallery">
                                <img class="cms-img-cover" width="408" height="360" alt="{{ $gallery->title }}" src="{{ $gallery->cover_image_url ?: $assetPath('images/gallery/img01.webp') }}">
                                <div class="gallery-thumb-view">
                                    <a href="{{ $gallery->cover_image_url ?: $assetPath('images/gallery/img01.webp') }}" data-fancybox="gallery">
                                        <img src="{{ $assetPath('images/icons/eye.svg') }}" alt="View">
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                @empty
                    <div class="col-lg-12">
                        <div class="alert alert-info mb-0">No galleries found.</div>
                    </div>
                @endforelse
            </div>

            <div class="mt-40">
                {{ $galleries->appends(request()->query())->links() }}
            </div>
        </div>
    </div>
    @include('frontend.partials.newsletter')
@endsection