{{-- Category showcase component
     Usage: @include('florial::sections.category-showcase', ['sectionKey' => 'homepage_categories'])
--}}
@php
    $ts = themeService()->boot();
    $section = $ts->section($sectionKey ?? '');
    if (!$section) return;

    $settings = $ts->settings($sectionKey);
    $sectionTitle = $ts->trans($sectionKey, 'section_title');
    $viewAllText = $ts->trans($sectionKey, 'view_all_text');
    $viewAllUrl = $ts->config($sectionKey, 'view_all_url', '');

    $categoryId = $settings['category_id'] ?? null;
    $itemsCount = $settings['items_count'] ?? 6;

    // Fetch categories
    $categoriesQuery = \ViartasShop\ProductCategories\Models\Accounting\ProductCategory::where('is_visible', true);

    if ($categoryId) {
        $categoriesQuery->where('product_category_id', $categoryId);
    } else {
        $categoriesQuery->whereNull('product_category_id');
    }

    $categories = $categoriesQuery->orderBy('id')->limit($itemsCount)->get();
@endphp

@if($categories->isNotEmpty())
<div class="d-flex justify-content-between align-items-center mt-5 mb-4">
    @if($sectionTitle)
        <h2 class="fw-semibold m-0">{{ $sectionTitle }}</h2>
    @endif
    @if($viewAllText && $viewAllUrl)
        <a href="{{ $viewAllUrl }}" class="text-decoration-none fw-medium">
            {{ $viewAllText }} →
        </a>
    @endif
</div>

<div class="row g-3">
    @foreach($categories as $category)
        <div class="col-6 col-md-4 col-lg-2">
            <a href="{{ $category->getRoute() ?? '#' }}" class="category-card text-center">
                @if($category->getFirstMediaUrl('default', 'thumb'))
                    <img src="{{ $category->getFirstMediaUrl('default', 'thumb') }}"
                         class="category-icon" alt="{{ $category->title }}">
                @else
                    <svg viewBox="0 0 24 24" class="category-icon">
                        <path d="M12 21s-7-4.5-7-10a4 4 0 017-2 4 4 0 017 2c0 5.5-7 10-7 10z"/>
                    </svg>
                @endif
                <span>{{ $category->title }}</span>
            </a>
        </div>
    @endforeach
</div>
@endif
