 <div class="container">
     <div class="row">
         <div class="col-xl-6 col-lg-8 col-md-10 mx-auto">
             <div class="mb-4 mb-lg-5 text-center">
                 <h3 class="mb-3">{{ __($content->data_values->knowledge_base_title ?? '') }}</h3>
                 <p>{{ __($content->data_values->knowledge_base_subtitle ?? '') }}</p>
             </div>
         </div>
     </div>
     <div class="row gy-4">
         @forelse ($categories as $category)
             <div class="col-xl-4 col-md-6">
                 <div class="knowledge-category-item">
                     <div class="knowledge-category-item-header">
                         <div class="knowledge-category-item-header-thumb">
                             <img src="{{ getImage(getFilePath('knowledgeCategory') . '/' . $category->image, getFileSize('knowledgeCategory')) }}" alt="">
                         </div>

                         <div class="knowledge-category-item-header-content">
                             <h6 class="title">
                                 <a href="{{ route('category', $category->slug) }}">{{ __($category->name) }}</a>
                             </h6>
                         </div>
                     </div>

                     <div class="knowledge-category-item-body">{{ __($category->description) }}</div>

                     <div class="knowledge-category-item-footer">
                         <span class="knowledge-category-item-footer-text">
                             {{ max($category->knowledge_count, $category->subcategories_knowledge_count) ?? 0 }} @lang('Articles')
                         </span>
                         <span class="knowledge-category-item-footer-text">
                             {{ showDateTime($category->created_at, 'Y-m-d') }} @lang('Created')
                         </span>
                     </div>
                 </div>
             </div>

         @empty
             <x-empty-message message="No category found" />
         @endforelse
     </div>
 </div>
