@extends('layouts.admin')
@section('title', 'Edit Community')
@section('subtitle', 'Update details for ' . $community->name)

@section('content')
<div class="max-w-2xl">
    <div class="mb-6">
        <a href="{{ route('admin.communities.index') }}" class="flex items-center gap-2 text-xs font-bold text-slate-400 hover:text-primary uppercase tracking-widest transition-colors">
            <span class="material-icons text-sm">arrow_back</span> Back to Communities
        </a>
    </div>

    <div class="bg-white rounded-3xl shadow-sm border border-slate-100 p-8">
        <form action="{{ route('admin.communities.update', $community) }}" method="POST" class="space-y-6">
            @csrf
            @method('PUT')

            <div>
                <label class="block text-[10px] font-black uppercase tracking-widest text-slate-400 mb-2">Community Name <span class="text-red-400">*</span></label>
                <input name="name" value="{{ old('name', $community->name) }}" required
                    class="w-full border border-slate-200 rounded-xl px-4 py-3 text-sm focus:ring-2 focus:ring-primary focus:border-primary">
                <p class="text-[10px] text-slate-400 mt-1.5 font-medium">Slug: <code class="bg-slate-100 px-1 rounded">{{ $community->slug }}</code> (auto-updated on save)</p>
            </div>

            <div>
                <label class="block text-[10px] font-black uppercase tracking-widest text-slate-400 mb-2">Parent Community (optional)</label>
                <select name="parent_id" class="w-full border border-slate-200 rounded-xl px-4 py-3 text-sm focus:ring-2 focus:ring-primary focus:border-primary">
                    <option value="">None (Top-Level Community)</option>
                    @foreach($communities as $parent)
                        <option value="{{ $parent->id }}" {{ old('parent_id', $community->parent_id) == $parent->id ? 'selected' : '' }}>{{ $parent->name }}</option>
                    @endforeach
                </select>
                <p class="text-[10px] text-slate-400 mt-1.5 font-medium">Select if this community is a sub-community of another.</p>
            </div>

            <div>
                <label class="block text-[10px] font-black uppercase tracking-widest text-slate-400 mb-2">Short Description</label>
                <textarea name="short_description" rows="4"
                    class="w-full border border-slate-200 rounded-xl px-4 py-3 text-sm focus:ring-2 focus:ring-primary focus:border-primary resize-none">{{ old('short_description', $community->short_description) }}</textarea>
            </div>

            <div class="flex items-center gap-4">
                <button type="submit" class="px-8 py-3 bg-primary text-white font-black rounded-2xl hover:scale-[1.02] active:scale-[0.98] transition-all text-xs uppercase tracking-widest shadow-lg shadow-primary/30">
                    Save Changes
                </button>
                <a href="{{ route('admin.communities.index') }}" class="px-8 py-3 bg-slate-100 text-slate-600 font-bold rounded-2xl hover:bg-slate-200 transition-all text-xs uppercase tracking-widest">
                    Cancel
                </a>
            </div>
        </form>
    </div>
</div>
@endsection