<x-admin-layout :title="$item->exists ? 'Edit Coach' : 'Create Coach'">
    <x-admin.form-panel :back-route="route('admin.coaches.index')">
        <form method="POST" action="{{ $item->exists ? route('admin.coaches.update', $item) : route('admin.coaches.store') }}" enctype="multipart/form-data" class="space-y-4">
            @csrf
            @if ($item->exists) @method('PUT') @endif

            <div class="grid grid-cols-2 gap-4">
                <div>
                    <label class="block text-sm font-medium">Name</label>
                    <input name="name" value="{{ old('name', $item->name) }}" class="admin-input" required>
                </div>
                <div>
                    <label class="block text-sm font-medium">Slug</label>
                    <input name="slug" value="{{ old('slug', $item->slug) }}" class="admin-input" required>
                </div>
            </div>
            <div>
                <label class="block text-sm font-medium">Role</label>
                <input name="role" value="{{ old('role', $item->role) }}" class="admin-input" required>
            </div>
            <div>
                <label class="block text-sm font-medium">Bio</label>
                <textarea name="bio" rows="4" class="admin-input">{{ old('bio', $item->bio) }}</textarea>
            </div>
            <div class="grid grid-cols-2 gap-4">
                <div>
                    <label class="block text-sm font-medium">Photo</label>
                    <input type="file" name="photo" accept="image/*" class="admin-input">
                    @if ($item->photo_path)
                        <div class="mt-2 flex items-center gap-3">
                            <img src="{{ $item->photoUrl() }}" class="w-16 h-16 rounded-full object-cover" alt="">
                            <p class="text-xs text-gray-500">Current photo. Upload a new file to replace it.</p>
                        </div>
                    @endif
                    @error('photo')
                        <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                    @enderror
                </div>
                <div>
                    <label class="block text-sm font-medium">Media Tag</label>
                    <input name="media_tag" value="{{ old('media_tag', $item->media_tag) }}" class="admin-input">
                </div>
            </div>
            <div>
                <label class="block text-sm font-medium">Tags (comma-separated)</label>
                <input name="tags" value="{{ old('tags', is_array($item->tags) ? implode(', ', $item->tags) : $item->tags) }}" class="admin-input">
            </div>
            <div class="grid grid-cols-2 gap-4">
                <div>
                    <label class="block text-sm font-medium">Sort Order</label>
                    <input type="number" name="sort_order" value="{{ old('sort_order', $item->sort_order ?? 0) }}" class="admin-input" required>
                </div>
                <div class="flex flex-col gap-2 pt-6">
                    <label class="flex items-center gap-2">
                        <input type="checkbox" name="show_on_home" value="1" @checked(old('show_on_home', $item->show_on_home ?? false))>
                        <span class="text-sm font-medium">Show on Home</span>
                    </label>
                    <label class="flex items-center gap-2">
                        <input type="checkbox" name="show_on_about" value="1" @checked(old('show_on_about', $item->show_on_about ?? false))>
                        <span class="text-sm font-medium">Show on About</span>
                    </label>
                    <label class="flex items-center gap-2">
                        <input type="checkbox" name="is_active" value="1" @checked(old('is_active', $item->is_active ?? true))>
                        <span class="text-sm font-medium">Active</span>
                    </label>
                </div>
            </div>
            <button type="submit" class="admin-btn-primary">Save</button>
        </form>
    </x-admin.form-panel>
</x-admin-layout>
