

<?php $__env->startSection('title', $page->title); ?>

<?php $__env->startSection('content'); ?>

<?php

    /*
    |--------------------------------------------------------------------------
    | HERO IMAGE
    |--------------------------------------------------------------------------
    |
    | We are temporarily using the existing hero_image setting.
    | If no image exists, a neutral fallback is displayed.
    |
    */

    $heroImage = $settings->hero_image ?? null;

    $heroImageUrl = $heroImage
        ? asset('storage/' . $heroImage)
        : 'https://images.unsplash.com/photo-1580582932707-520aed937b7b?w=1920';


    /*
    |--------------------------------------------------------------------------
    | CHECK WHETHER THIS IS THE GALLERY PAGE
    |--------------------------------------------------------------------------
    */

    $isGalleryPage = strtolower($page->slug ?? '') === 'gallery';


    /*
    |--------------------------------------------------------------------------
    | GALLERY CATEGORIES
    |--------------------------------------------------------------------------
    */

    $galleryCategories = collect($gallery ?? [])
        ->filter(function ($item) {
            return !empty($item->category);
        })
        ->pluck('category')
        ->unique()
        ->values();

?>


<!-- =========================================================
     UNIVERSAL PAGE HERO
========================================================= -->

<section
    id="page-hero"
    class="relative w-full overflow-hidden bg-primary"
>

    <div
        class="relative w-full"
    >

        <img
            src="<?php echo e($heroImageUrl); ?>"
            alt="<?php echo e($page->title); ?>"
            class="w-full h-[400px] md:h-[500px] lg:h-[550px] object-cover"
        >


        <!-- DARK OVERLAY -->

        <div
            class="absolute inset-0 bg-black/50"
        ></div>


        <!-- HERO CONTENT -->

        <div
            class="absolute inset-0 flex items-center"
        >

            <div
                class="container mx-auto px-6 md:px-10 lg:px-16"
            >

                <div
                    class="max-w-3xl"
                >

                    <!-- SCHOOL NAME -->

                    <div
                        class="inline-block bg-primary px-4 py-2 rounded-md text-white font-bold uppercase tracking-widest text-xs md:text-sm mb-5 shadow-md"
                    >

                        <?php echo e($settings->school_name ?? 'Pearl School'); ?>


                    </div>


                    <!-- PAGE TITLE -->

                    <h1
                        class="text-4xl md:text-5xl lg:text-6xl font-extrabold leading-tight text-white drop-shadow-lg"
                    >

                        <?php echo e($page->title); ?>


                    </h1>


                    <!-- PAGE HERO DESCRIPTION -->

                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($isGalleryPage): ?>

                        <p
                            class="mt-5 text-lg md:text-xl text-white/90 max-w-2xl leading-relaxed drop-shadow-md"
                        >

                            A glimpse into the learning, creativity, achievements
                            and memorable moments that make
                            <?php echo e($settings->school_name ?? 'Pearl School'); ?>

                            a special place to learn and grow.

                        </p>

                    <?php else: ?>

                        <p
                            class="mt-5 text-lg md:text-xl text-white/90 max-w-2xl leading-relaxed drop-shadow-md"
                        >

                            Discover excellence, character, creativity and
                            meaningful learning at
                            <?php echo e($settings->school_name ?? 'Pearl School'); ?>.

                        </p>

                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                </div>

            </div>

        </div>

    </div>

</section>


<?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($isGalleryPage): ?>

<!-- =========================================================
     GALLERY INTRODUCTION
========================================================= -->

<section
    class="bg-white py-16 md:py-20"
>

    <div
        class="container mx-auto px-6"
    >

        <div
            class="max-w-4xl mx-auto text-center"
        >

            <div
                class="text-secondary font-bold uppercase tracking-wider text-sm"
            >

                School Life

            </div>


            <div
                class="w-12 h-1 bg-secondary mx-auto mt-3 mb-6"
            ></div>


            <h2
                class="text-3xl md:text-4xl font-extrabold text-primary"
            >

                Every Moment Tells a Story

            </h2>


            <p
                class="mt-6 text-gray-600 text-base md:text-lg leading-8"
            >

                At <?php echo e($settings->school_name ?? 'Pearl School'); ?>,
                education goes beyond the classroom. Our pupils learn,
                explore, create, collaborate and build friendships through
                a wide range of academic, creative, sporting and social
                experiences.

            </p>


            <p
                class="mt-4 text-gray-600 text-base md:text-lg leading-8"
            >

                Our gallery captures some of these memorable moments,
                giving parents, families and visitors a glimpse into the
                vibrant school life that helps shape confident,
                responsible and well-rounded young people.

            </p>

        </div>

    </div>

</section>


<!-- =========================================================
     GALLERY CATEGORY NAVIGATION
========================================================= -->

<?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($galleryCategories->count()): ?>

<section
    class="bg-gray-50 border-y border-gray-200 py-8"
>

    <div
        class="container mx-auto px-6"
    >

        <div
            class="flex flex-wrap justify-center gap-3"
        >

            <a
                href="#gallery"
                class="inline-flex items-center px-5 py-2.5 rounded-full bg-primary text-white font-semibold text-sm hover:opacity-90 transition"
            >

                All Moments

            </a>


            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $galleryCategories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $category): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>

                <a
                    href="#category-<?php echo e(\Illuminate\Support\Str::slug($category)); ?>"
                    class="inline-flex items-center px-5 py-2.5 rounded-full bg-white border border-gray-200 text-primary font-semibold text-sm hover:bg-primary hover:text-white transition"
                >

                    <?php echo e($category); ?>


                </a>

            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

        </div>

    </div>

</section>

<?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>


<!-- =========================================================
     MAIN GALLERY
========================================================= -->

<section
    id="gallery"
    class="bg-white py-16 md:py-20"
>

    <div
        class="container mx-auto px-6"
    >

        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($gallery->count()): ?>

            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $galleryCategories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $category): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>

                <?php

                    $categoryItems = $gallery->filter(function ($item) use ($category) {

                        return strtolower(trim($item->category ?? ''))
                            === strtolower(trim($category));

                    });

                ?>


                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($categoryItems->count()): ?>

                <!-- =================================================
                     CATEGORY SECTION
                ================================================== -->

                <div
                    id="category-<?php echo e(\Illuminate\Support\Str::slug($category)); ?>"
                    class="mb-20 scroll-mt-24"
                >

                    <!-- CATEGORY HEADER -->

                    <div
                        class="max-w-3xl mb-10"
                    >

                        <div
                            class="text-secondary font-bold uppercase tracking-wider text-sm"
                        >

                            School Life

                        </div>


                        <div
                            class="w-12 h-1 bg-secondary mt-3 mb-4"
                        ></div>


                        <h2
                            class="text-3xl md:text-4xl font-extrabold text-primary"
                        >

                            <?php echo e($category); ?>


                        </h2>


                        <p
                            class="mt-4 text-gray-600 leading-7"
                        >

                            Explore some of our memorable moments from
                            <?php echo e(strtolower($category)); ?> at
                            <?php echo e($settings->school_name ?? 'Pearl School'); ?>.

                        </p>

                    </div>


                    <!-- CATEGORY ITEMS -->

                    <div
                        class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"
                    >

                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $categoryItems; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>

                            <article
                                class="group bg-white rounded-2xl overflow-hidden border border-gray-100 shadow-md hover:shadow-xl transition duration-300"
                            >

                                <!-- IMAGE -->

                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($item->image): ?>

                                    <div
                                        class="relative overflow-hidden"
                                    >

                                        <img
                                            src="<?php echo e(asset('storage/' . $item->image)); ?>"
                                            alt="<?php echo e($item->title ?? $category); ?>"
                                            class="w-full h-64 object-cover group-hover:scale-105 transition duration-500"
                                        >


                                        <!-- CATEGORY BADGE -->

                                        <div
                                            class="absolute top-4 left-4"
                                        >

                                            <span
                                                class="inline-flex bg-primary/90 text-white text-xs font-bold px-3 py-1.5 rounded-full shadow"
                                            >

                                                <?php echo e($category); ?>


                                            </span>

                                        </div>

                                    </div>

                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>


                                <!-- CONTENT -->

                                <div
                                    class="p-6"
                                >

                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($item->title): ?>

                                        <h3
                                            class="text-xl font-bold text-primary"
                                        >

                                            <?php echo e($item->title); ?>


                                        </h3>

                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>


                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($item->description): ?>

                                        <p
                                            class="mt-3 text-gray-600 leading-7"
                                        >

                                            <?php echo e($item->description); ?>


                                        </p>

                                    <?php else: ?>

                                        <p
                                            class="mt-3 text-gray-500 leading-7"
                                        >

                                            A memorable moment from life at
                                            <?php echo e($settings->school_name ?? 'Pearl School'); ?>.

                                        </p>

                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                                </div>

                            </article>

                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                    </div>

                </div>

                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>


            <!-- =====================================================
                 UNCATEGORIZED GALLERY ITEMS
            ====================================================== -->

            <?php

                $uncategorized = $gallery->filter(function ($item) {

                    return empty(trim($item->category ?? ''));

                });

            ?>


            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($uncategorized->count()): ?>

                <div
                    class="mb-20"
                >

                    <div
                        class="max-w-3xl mb-10"
                    >

                        <div
                            class="text-secondary font-bold uppercase tracking-wider text-sm"
                        >

                            More Moments

                        </div>


                        <div
                            class="w-12 h-1 bg-secondary mt-3 mb-4"
                        ></div>


                        <h2
                            class="text-3xl md:text-4xl font-extrabold text-primary"
                        >

                            More From Our School Life

                        </h2>

                    </div>


                    <div
                        class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"
                    >

                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $uncategorized; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>

                            <article
                                class="group bg-white rounded-2xl overflow-hidden border border-gray-100 shadow-md hover:shadow-xl transition duration-300"
                            >

                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($item->image): ?>

                                    <div
                                        class="overflow-hidden"
                                    >

                                        <img
                                            src="<?php echo e(asset('storage/' . $item->image)); ?>"
                                            alt="<?php echo e($item->title ?? 'Pearl School'); ?>"
                                            class="w-full h-64 object-cover group-hover:scale-105 transition duration-500"
                                        >

                                    </div>

                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>


                                <div
                                    class="p-6"
                                >

                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($item->title): ?>

                                        <h3
                                            class="text-xl font-bold text-primary"
                                        >

                                            <?php echo e($item->title); ?>


                                        </h3>

                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>


                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($item->description): ?>

                                        <p
                                            class="mt-3 text-gray-600 leading-7"
                                        >

                                            <?php echo e($item->description); ?>


                                        </p>

                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                                </div>

                            </article>

                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                    </div>

                </div>

            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>


        <?php else: ?>

            <!-- =================================================
                 EMPTY GALLERY
            ================================================== -->

            <div
                class="max-w-3xl mx-auto text-center py-16"
            >

                <div
                    class="w-20 h-20 mx-auto rounded-full bg-primary/10 flex items-center justify-center text-3xl"
                >

                    📷

                </div>


                <h2
                    class="mt-6 text-2xl md:text-3xl font-extrabold text-primary"
                >

                    Our Gallery Is Coming Soon

                </h2>


                <p
                    class="mt-4 text-gray-600 leading-7"
                >

                    We are preparing a collection of memorable moments
                    from school life, academic activities, events,
                    creativity and student achievements.

                </p>

            </div>

        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

    </div>

</section>


<!-- =========================================================
     GALLERY CLOSING MESSAGE
========================================================= -->

<section
    class="bg-primary py-16 md:py-20"
>

    <div
        class="container mx-auto px-6"
    >

        <div
            class="max-w-4xl mx-auto text-center text-white"
        >

            <div
                class="text-secondary font-bold uppercase tracking-wider text-sm"
            >

                Life at <?php echo e($settings->school_name ?? 'Pearl School'); ?>


            </div>


            <div
                class="w-12 h-1 bg-secondary mx-auto mt-3 mb-6"
            ></div>


            <h2
                class="text-3xl md:text-4xl font-extrabold"
            >

                Learning. Growing. Creating Memories.

            </h2>


            <p
                class="mt-6 text-white/80 text-base md:text-lg leading-8"
            >

                Every photograph represents more than a moment.
                It represents a lesson learned, a friendship formed,
                a challenge overcome, a talent discovered or a memory
                created.

                At <?php echo e($settings->school_name ?? 'Pearl School'); ?>,
                we believe these experiences are an important part of
                every child's journey.

            </p>

        </div>

    </div>

</section>


<?php else: ?>

<!-- =========================================================
     STANDARD ADMIN-CREATED PAGE CONTENT
========================================================= -->

<section
    class="bg-gray-50 py-12 md:py-16"
>

    <div
        class="container mx-auto px-6"
    >

        <div
            class="max-w-5xl mx-auto bg-white p-6 md:p-10 lg:p-12 rounded-2xl shadow-sm border border-gray-100"
        >

            <div
                class="prose prose-lg max-w-none"
            >

                <?php echo $page->content; ?>


            </div>

        </div>

    </div>

</section>

<?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\laragon\www\pearlschool\resources\views/page.blade.php ENDPATH**/ ?>