@extends('layouts.dashboard')
@section('title', $category->id ? 'Edit Category' : 'New Category')
@section('page-title', $category->id ? 'Edit Category' : 'New Category')
@section('content')
<div class="content-card" style="max-width:700px;">
    <form method="POST" action="{{ $category->id ? route('admin.categories.update', $category) : route('admin.categories.store') }}">
        @csrf
        @if($category->id)@method('PUT')@endif

        <div class="mb-3">
            <label class="form-label">Name</label>
            <input type="text" name="name" class="form-control" value="{{ old('name', $category->name) }}" required>
        </div>

        <div class="mb-3">
            <label class="form-label">Parent Category (optional)</label>
            <select name="parent_id" class="form-select">
                <option value="">— Root Category —</option>
                @foreach($flat as $opt)
                    <option value="{{ $opt['id'] }}" {{ old('parent_id', $category->parent_id) == $opt['id'] ? 'selected' : '' }}>{{ $opt['name'] }}</option>
                @endforeach
            </select>
            <small class="text-muted">You can nest categories to any depth.</small>
        </div>

        <div class="mb-3">
            <label class="form-label">Description</label>
            <textarea name="description" rows="3" class="form-control">{{ old('description', $category->description) }}</textarea>
        </div>

        <div class="row">
            <div class="col-md-6 mb-3">
                <label class="form-label">Icon (optional CSS class or emoji)</label>
                <input type="text" name="icon" class="form-control" value="{{ old('icon', $category->icon) }}">
            </div>
            <div class="col-md-6 mb-3">
                <label class="form-label">Sort Order</label>
                <input type="number" name="sort_order" class="form-control" value="{{ old('sort_order', $category->sort_order ?? 0) }}">
            </div>
        </div>

        <div class="form-check mb-4">
            <input type="hidden" name="is_active" value="0">
            <input type="checkbox" name="is_active" id="is_active" value="1" class="form-check-input" {{ old('is_active', $category->is_active ?? 1) ? 'checked' : '' }}>
            <label for="is_active" class="form-check-label">Active</label>
        </div>

        <div class="d-flex gap-2">
            <button class="btn btn-primary">Save Category</button>
            <a href="{{ route('admin.categories.index') }}" class="btn btn-outline-secondary">Cancel</a>
        </div>
    </form>
</div>
@endsection
