@extends('layouts.site')

@section('title', 'Pierre2.net')

@section('content')
<div class="space-y-10">
    @foreach($categories as $category)
        @php $catTrans = $category->translation($locale); @endphp
        @if($catTrans)
        <section>
            <div class="flex items-center gap-3 mb-4">
                <h2 class="text-xl font-bold text-primary dark:text-primary-dark">
                    <a href="{{ route('category.show', [$locale, $catTrans->slug]) }}" class="hover:text-secondary transition-colors">
                        {{ $catTrans->name }}
                    </a>
                </h2>
                <div class="flex-1 h-px bg-gradient-to-r from-primary/30 to-transparent"></div>
            </div>

            <div class="grid gap-4 sm:grid-cols-2">
                @foreach($category->posts->take(6) as $post)
                    @include('partials.post-card', ['post' => $post, 'locale' => $locale])
                @endforeach
            </div>

            @if($category->posts->count() > 6)
            <div class="mt-3 text-right">
                <a href="{{ route('category.show', [$locale, $catTrans->slug]) }}"
                   class="text-sm text-primary hover:text-secondary dark:text-primary-dark font-medium">
                    {{ __('See all') }} &rarr;
                </a>
            </div>
            @endif
        </section>
        @endif
    @endforeach
</div>
@endsection