{{-- Category showcase component
     Usage: @include('themes-manager::components.web.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;
    $columns = $settings['columns'] ?? 6;
    $showIcons = $settings['show_icons'] ?? true;

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

    if ($categoryId) {
        // Get children of the specified parent category
        $categoriesQuery->where('product_category_id', $categoryId);
    } else {
        // Get top-level categories
        $categoriesQuery->whereNull('product_category_id');
    }

    $categories = $categoriesQuery->orderBy('sort')->limit($itemsCount)->get();
    $colClass = 'col-xxl-' . (12 / min($columns, 6));
@endphp

@if($categories->isNotEmpty())
<section class="category-section">
    <div class="container-fluid-lg">
        @if($sectionTitle)
        <div class="title d-block">
            <div>
                <h2>{{ $sectionTitle }}</h2>
            </div>
            @if($viewAllText && $viewAllUrl)
                <a href="{{ $viewAllUrl }}" class="title-link">{{ $viewAllText }} →</a>
            @endif
        </div>
        @endif

        <div class="row g-3">
            @foreach($categories as $category)
                <div class="{{ $colClass }} col-lg-3 col-md-4 col-6">
                    <div class="category-box category-dark wow fadeInUp">
                        <a href="{{ $category->getRoute() ?? '#' }}">
                            @if($showIcons)
                            <div class="category-image">
                                @if($category->getFirstMediaUrl('default', 'thumb'))
                                    <img src="{{ $category->getFirstMediaUrl('default', 'thumb') }}"
                                         class="blur-up lazyload" alt="{{ $category->title }}">
                                @else
                                    <i class="fas fa-tag" style="font-size: 32px;"></i>
                                @endif
                            </div>
                            @endif
                            <div class="category-name">
                                <h6>{{ $category->title }}</h6>
                            </div>
                        </a>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
</section>
@endif
