@extends('user::layouts.backend-master')
@section('breadcrumb_title', 'Edit Blog Category')

@section('content')
    <div class="flex justify-between items-center flex-wrap gap-3 mb-6">
        <h1 class="text-2xl font-semibold">Edit Blog Category: {{ $blogCategory->name }}</h1>
        <div class="flex gap-3">
            <a href="{{ route('admin.blog-categories.show', $blogCategory->id) }}" class="btn btn-primary btn-black">
                <i class="fas fa-eye mr-2"></i> View
            </a>
            <a href="{{ route('admin.blog-categories.index') }}" class="btn btn-primary">
                <i class="fas fa-arrow-left mr-2"></i> Back to Categories
            </a>
        </div>
    </div>

    <div class="mb-5">
        <x-backend::taxonomy-language-switcher :taxonomy="$blogCategory" taxonomyType="category"
            route="admin.blog-categories.edit" />
    </div>

    <div class="card">
        <form action="{{ route('admin.blog-categories.update', $blogCategory->id) }}" method="POST"
            enctype="multipart/form-data">
            @csrf
            @method('PUT')

            <input type="hidden" name="id" value="{{ $blogCategory->id }}">
            <input type="hidden" name="taxonomy_type" value="category">
            <input type="hidden" name="language_code" value="{{ $blogCategory->language_code }}">

            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
                <!-- Left Column -->
                <div class="md:col-span-2 space-y-4">
                    <div class="input-with-label">
                        <label for="name">Name <span class="text-red-500">*</span></label>
                        <input type="text" id="name" name="name" value="{{ old('name', $blogCategory->name) }}"
                            required>
                        @error('name')
                            <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                        @enderror
                    </div>

                    <div class="input-with-label">
                        <label for="slug">Slug</label>
                        <input type="text" id="slug" name="slug" value="{{ old('slug', $blogCategory->slug) }}">
                        @error('slug')
                            <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                        @enderror
                    </div>

                    <div class="input-with-label">
                        <label for="description">Description</label>
                        <textarea id="description" name="description" rows="4">{{ old('description', $blogCategory->description) }}</textarea>
                        @error('description')
                            <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                        @enderror
                    </div>
                </div>

                <!-- Right Column -->
                <div class="space-y-4">
                    <div class="input-with-label">
                        <label for="parent_id">Parent Category</label>
                        <select id="parent_id" name="parent_id" class="form-select">
                            <option value="">None (Top Level)</option>
                            @foreach ($parentCategories as $parentCategory)
                                <option value="{{ $parentCategory->id }}"
                                    {{ old('parent_id', $blogCategory->parent_id) == $parentCategory->id ? 'selected' : '' }}>
                                    {{ $parentCategory->name }}
                                </option>
                            @endforeach
                        </select>
                        @error('parent_id')
                            <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                        @enderror
                    </div>

                    <div class="flex items-center gap-2">
                        <input type="hidden" name="meta_data[is_featured]" value="0">
                        <label class="inline-flex items-center cursor-pointer">
                            <input type="checkbox" id="is_featured" name="meta_data[is_featured]" value="1"
                                @checked(old('meta_data.is_featured', $blogCategory->getMeta('is_featured')))>
                            <span class="ml-2">Is Featured Category</span>
                        </label>
                    </div>

                    <div>
                        @include('backend::components.featured-image', [
                            'preview' => $blogCategory->getFirstMediaUrl('featured'),
                            'media' => $blogCategory->getFirstMedia('featured')
                        ]);
                    </div>
                </div>
            </div>

            <div class="mt-6 flex gap-3 flex-wrap">
                <button type="submit" class="btn btn-primary">
                    Update Category
                </button>
                <a href="{{ route('admin.blog-categories.index') }}" class="btn btn-secondary">
                    Cancel
                </a>
            </div>
        </form>
    </div>
@endsection