@extends('admin.layouts.app')

@section('title', 'Kateqoriyalar')

@section('content')
<div class="admin-header-row">
    <div>
        <h1 class="admin-title">Kateqoriyalar</h1>
        <p class="admin-page-description">Məhsul qruplarını buradan idarə edin. Əsas kateqoriya yaradın, sonra onun altında alt kateqoriyalar əlavə edin.</p>
    </div>
    <a href="{{ route('admin.categories.create') }}" class="admin-btn admin-btn-primary">+ Kateqoriya əlavə et</a>
</div>

<div class="simple-tree-list">
    @forelse($categories as $category)
        <section class="simple-tree-card">
            <div class="simple-tree-row">
                <div class="simple-tree-info">
                    @if($category->image)
                        <img src="{{ asset('images/' . $category->image) }}" alt="">
                    @endif
                    <div>
                        <strong>{{ $category->name }}</strong>
                        <span>Əsas kateqoriya · {{ $category->products_count }} məhsul</span>
                    </div>
                </div>
                <div class="admin-actions">
                    <a href="{{ route('admin.categories.create', ['parent' => $category->id]) }}" class="admin-btn admin-btn-primary">+ Alt kateqoriya</a>
                    <a href="{{ route('admin.categories.edit', $category) }}" class="admin-btn admin-btn-secondary">Dəyiş</a>
                    <form method="POST" action="{{ route('admin.categories.destroy', $category) }}" onsubmit="return confirm('Bu əsas kateqoriya silinsin? Məhsulları varsa silmək mümkün olmaya bilər.')">
                        @csrf
                        @method('DELETE')
                        <button class="admin-btn admin-btn-danger">Sil</button>
                    </form>
                </div>
            </div>

            @forelse($category->children as $child)
                <div class="simple-tree-row simple-tree-child">
                    <div class="simple-tree-info">
                        @if($child->image)
                            <img src="{{ asset('images/' . $child->image) }}" alt="">
                        @endif
                        <div>
                            <strong>{{ $child->name }}</strong>
                            <span>Alt kateqoriya · {{ $child->products_count }} məhsul</span>
                        </div>
                    </div>
                    <div class="admin-actions">
                        <a href="{{ route('admin.categories.edit', $child) }}" class="admin-btn admin-btn-secondary">Dəyiş</a>
                        <form method="POST" action="{{ route('admin.categories.destroy', $child) }}" onsubmit="return confirm('Alt kateqoriya silinsin?')">
                            @csrf
                            @method('DELETE')
                            <button class="admin-btn admin-btn-danger">Sil</button>
                        </form>
                    </div>
                </div>
            @empty
                <div class="simple-tree-row simple-tree-child">
                    <div class="simple-tree-info">
                        <div>
                            <span>Bu əsas kateqoriyanın altında hələ alt kateqoriya yoxdur.</span>
                        </div>
                    </div>
                </div>
            @endforelse
        </section>
    @empty
        <div class="admin-card admin-empty-state">Hələ kateqoriya yoxdur.</div>
    @endforelse
</div>
@endsection