@php
    $levelLabels = [0 => 'Main', 1 => 'Category', 2 => 'Sub', 3 => 'Child'];
@endphp
<ul class="cat-tree-list {{ $depth === 0 ? 'cat-tree-list--root' : '' }}">
    @foreach($nodes as $node)
        @php
            $hasChildren = !empty($node['children']);
            $level = $node['level'] ?? $depth;
            $cat = \App\Models\Category::find($node['id']);
        @endphp
        <li class="cat-tree-item" data-cat-tree-item>
            <div class="cat-tree-row" style="--cat-tree-depth: {{ $depth }}">
                @if($hasChildren)
                    <button type="button" class="cat-tree-toggle" data-cat-tree-toggle aria-expanded="true">
                        <i class="bi bi-chevron-down"></i>
                    </button>
                @else
                    <span class="cat-tree-toggle cat-tree-toggle--spacer"></span>
                @endif

                @if($cat)
                    @include('partials.category-thumb', ['category' => $cat, 'size' => 36])
                @endif

                <div class="cat-tree-meta flex-grow-1 min-w-0">
                    <div class="d-flex align-items-center gap-2 flex-wrap">
                        <a href="{{ route('admin.categories.show', $node['id']) }}" class="fw-semibold text-dark text-decoration-none text-truncate">
                            {{ $node['name'] }}
                        </a>
                        <span class="badge {{ $cat?->levelBadgeClass() ?? 'bg-light text-dark' }} rounded-pill">{{ $levelLabels[$level] ?? 'L'.$level }}</span>
                        @if($node['is_featured'] ?? false)
                            <i class="bi bi-star-fill text-warning small"></i>
                        @endif
                    </div>
                    <small class="text-muted">/{{ $node['slug'] }}</small>
                </div>

                <div class="cat-tree-actions d-none d-md-flex gap-1">
                    <a href="{{ route('admin.categories.create', ['parent_id' => $node['id']]) }}" class="btn btn-sm btn-light border" title="Add child"><i class="bi bi-plus-lg"></i></a>
                    <a href="{{ route('admin.categories.edit', $node['id']) }}" class="btn btn-sm btn-light border text-primary" title="Edit"><i class="bi bi-pencil"></i></a>
                    <a href="{{ route('admin.categories.show', $node['id']) }}" class="btn btn-sm btn-light border" title="View"><i class="bi bi-eye"></i></a>
                </div>
            </div>

            @if($hasChildren)
                <div class="cat-tree-children" data-cat-tree-children>
                    @include('admin.categories.partials.tree-node', ['nodes' => $node['children'], 'depth' => $depth + 1])
                </div>
            @endif
        </li>
    @endforeach
</ul>