@if($articles->count() > 10000000)
<!-- hidden -->
<div>
    <div class="flex items-center justify-between mb-6">
        <div class="flex items-center gap-3">
            <div class="bg-background-secondary border border-neutral p-2 rounded-lg">

            </div>
            <h2 class="text-xl font-semibold">{{ __('Knowledge Base') }}</h2>
        </div>
    </div>
    <div class="space-y-4">
        @foreach($articles as $article)
        <a href="{{ route('knowledgebase.show', $article) }}" wire:navigate>
            <div
                class="bg-background-secondary hover:bg-background-secondary/80 border border-neutral p-4 rounded-lg mb-4">
                <div class="flex items-center justify-between mb-2">
                    <div class="flex items-center gap-3">
                        <div class="bg-secondary/10 p-2 rounded-lg">
                            <x-ri-bookmark-line class="size-5 fill-secondary" />
                        </div>
                        <span class="font-medium">{{ $article->title }}</span>
                    </div>
                    <div class="prose dark:prose-invert text-sm">
                        {{ $article->published_at->diffForHumans() }}
                    </div>
                </div>
                <p class="prose dark:prose-invert text-sm">{{ $article->description }}</p>
            </div>
        </a>
        @endforeach
    </div>
    <x-navigation.link
        class="bg-background-secondary hover:bg-background-secondary/80 border border-neutral flex items-center justify-center rounded-lg"
        :href="route('knowledgebase.index')">
        {{ __('dashboard.view_all') }}
        <x-ri-arrow-right-fill class="size-5" />
    </x-navigation.link>
</div>
@endif