@extends('site.layouts.app')
@section('title', $category->name . ' | ' . config('site.name'))
@section('description', Str::limit($category->description, 160))

@section('content')
<section class="page-hero"><div class="container"><h1>{{ $category->name }}</h1><nav aria-label="breadcrumb"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="{{ route('site.home') }}">الرئيسية</a></li><li class="breadcrumb-item"><a href="{{ route('site.categories.index') }}">الأقسام</a></li><li class="breadcrumb-item active">{{ $category->name }}</li></ol></nav></div></section>
<section class="section-padding"><div class="container"><div class="row g-4">
    <div class="col-lg-3 d-none d-lg-block"><div class="cat-sidebar list-group">@foreach($navCategories as $cat)<a href="{{ route('site.categories.show', $cat) }}" class="list-group-item list-group-item-action {{ $cat->id === $category->id ? 'active' : '' }}">{{ $cat->name }}</a>@endforeach</div></div>
    <div class="col-lg-9">
        <p class="mb-4">{{ $category->description }}</p>
        <div class="row g-4">
            @forelse($products as $product)
                @include('site.partials.product-card', ['product' => $product])
            @empty
                <div class="col-12"><p class="text-muted">لا توجد منتجات في هذا القسم حالياً.</p></div>
            @endforelse
        </div>
        <div class="mt-4">{{ $products->links('site.partials.pagination') }}</div>
    </div>
</div></div></section>
@endsection