@foreach($categories as $category)

    @php
        // Collect main category products
        $allProducts = collect($category->products);

        // Merge sub-category products
        foreach ($category->sub_categories as $sub) {
            if ($sub->products->count()) {
                $allProducts = $allProducts->merge($sub->products);
            }
        }

        // Remove duplicate products
        $allProducts = $allProducts->unique('id')->values();
    @endphp

    @if($allProducts->count())
        <div class="category_products">
            <div class="card my-3">

                <div class="banner rounded-2 {{ $category->class_name }}" style="display: none;">
                    <div class="left ps-lg-5">
                        <div class="sub_title cavet">{{ $category->tag }}</div>
                        <div class="title">{{ $category->name }}</div>
                    </div>

                    <div class="right d-flex flex-wrap align-items-center pe-lg-5 gap-2">
                        <p class="mb-0">{{ $category->note }}</p>
                    </div>
                </div>

                <div class="card-body p-1">
                    <div class="category_header d-flex justify-content-between">
                        <h3 class="border-bottom border-muted border-2 flex-fill">
                            <strong class="border-bottom border-warning border-2">
                                {{ $category->name }}
                            </strong>
                        </h3>

                        <a href="{{ url('shop/' . $category->slug) }}"
                           class="btn orange-bg rounded-5 text-white btn-light opacity-75 medium ms-lg-3 ms-2">
                            See All
                        </a>
                    </div>

                    <div class="products mt-3">
                        @foreach($allProducts as $product)
                            @include('partials.product', ['product' => $product])
                        @endforeach
                    </div>
                </div>

            </div>
        </div>
    @endif

@endforeach