@extends('layouts.app')

@section('title', $category->seo_title ?: $category->name.' Content')
@section('meta_description', $category->seo_description ?: ($category->description ?: 'Browse '.$category->name.' content downloads.'))
@section('meta_keywords', $category->seo_keywords ?: strtolower($category->name.', '.$category->name.' content, free download'))
@section('canonical', request()->fullUrl())

@section('content')
    <nav class="text-sm text-slate-600 mb-5">
        <a href="{{ route('frontend.home') }}" class="hover:text-sky-600">Home</a>
        / <a href="{{ route('frontend.categories') }}" class="hover:text-sky-600">Categories</a>
        @foreach ($breadcrumbs as $crumb)
            / <a href="{{ $crumb->url }}" class="hover:text-sky-600">{{ $crumb->name }}</a>
        @endforeach
    </nav>

    <h1 class="text-3xl font-bold">{{ $category->name }}</h1>
    @if ($category->description)
        <p class="mt-2 text-slate-700">{{ $category->description }}</p>
    @endif

    @if ($hasChildren)
        <div class="mt-6 grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
            @foreach ($subcategories as $sub)
                <a href="{{ route('frontend.category.show', ['path' => $sub->slug_path]) }}" class="rounded-xl border border-slate-200 bg-white p-4 shadow-sm hover:border-sky-200">
                    <div class="inline-flex items-center gap-2">
                        <span class="text-xl">📁</span>
                        <div>
                            <p class="font-semibold">{{ $sub->name }}</p>
                            <p class="text-xs text-slate-500">{{ number_format((int) ($sub->nested_ringtones_count ?? 0)) }} files</p>
                        </div>
                    </div>
                </a>
            @endforeach
        </div>
    @else
        <div class="mt-6 grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
            @forelse ($ringtones as $ringtone)
                @include('frontend.partials.content-card', ['ringtone' => $ringtone])
            @empty
                <p>No content in this category yet.</p>
            @endforelse
        </div>

        @if ($ringtones instanceof \Illuminate\Contracts\Pagination\Paginator)
            <div class="mt-6">{{ $ringtones->links() }}</div>
        @endif
    @endif
@endsection