@if (isset($category->children) && $category->children->isNotEmpty())
<div class="mb-6">
    <div class="mb-6 text-lg font-medium">
        {{ $category->name }}
    </div>
    <div class="swiper shop-category-slider " style="padding: 10px;">
        <div class="swiper-wrapper">

            @foreach ($category->children as $child )

            <div class="swiper-slide">
                <div>
                    <a href="?category={{ $child->id }}" class="flex flex-col items-center justify-center {{ $child->image == null ? 'rounded-4xl px-2 py-2' : 'rounded-lg px-5 py-5' }} bg-muted  shadow">
                        @if ($child->image)
                        <img src="{{ asset("uploads/{$child->image}") }}" data-scope="category" onerror="window.app.handleBrokenImage(this)" class="mb-4 h-[85px]" alt="brand 1" />
                        @endif
                        <div class="text-center text-sm flex items-center justify-center">
                            {{ $child->name }}
                        </div>
                    </a>
                </div>
            </div>
            @endforeach

        </div>
        <div class="swiper-button-next main-slider-nav-button"></div>
        <div class="swiper-button-prev main-slider-nav-button"></div>
    </div>
</div>
@endif