@extends('layouts.admin')

@section('title', 'تعديل خطة')
@section('heading', 'تعديل خطة: '.$plan->name)
@section('subheading', 'الحدود تؤثر فوراً على تطبيق Flutter بعد التحديث')

@section('content')
    <div class="mb-6">
        <a href="{{ route('admin.subscription-plans.index') }}" class="text-sm font-medium text-teal-700 hover:underline">← العودة إلى الخطط</a>
    </div>

    <div class="mx-auto max-w-3xl rounded-2xl border border-zinc-200 bg-white p-6 shadow-sm">
        <form method="post" action="{{ route('admin.subscription-plans.update', $plan) }}">
            @csrf
            @method('PUT')

            <div class="space-y-5">
                <div>
                    <label class="mb-1 block text-sm font-medium text-zinc-700">المعرّف (slug)</label>
                    <p class="rounded-xl border border-zinc-100 bg-zinc-50 px-3 py-2 font-mono text-sm text-zinc-700">{{ $plan->slug }}</p>
                </div>

                <div>
                    <label for="name" class="mb-1 block text-sm font-medium text-zinc-700">الاسم المعروض</label>
                    <input id="name" name="name" type="text" value="{{ old('name', $plan->name) }}" required maxlength="120"
                           class="w-full rounded-xl border border-zinc-300 px-3 py-2 text-sm">
                    @error('name')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                </div>

                <div class="grid gap-5 sm:grid-cols-2">
                    <div>
                        <label for="price" class="mb-1 block text-sm font-medium text-zinc-700">السعر (عرضي — بدون دفع)</label>
                        <input id="price" name="price" type="text" inputmode="decimal" value="{{ old('price', $plan->price) }}" required
                               class="w-full rounded-xl border border-zinc-300 px-3 py-2 text-sm font-mono">
                        @error('price')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                    </div>
                    <div>
                        <label for="status" class="mb-1 block text-sm font-medium text-zinc-700">الحالة</label>
                        <select id="status" name="status" class="w-full rounded-xl border border-zinc-300 px-3 py-2 text-sm">
                            <option value="active" @selected(old('status', $plan->status) === 'active')>active</option>
                            <option value="inactive" @selected(old('status', $plan->status) === 'inactive')>inactive</option>
                        </select>
                        @error('status')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                    </div>
                </div>

                <div class="grid gap-5 sm:grid-cols-2">
                    <div>
                        <label for="daily_ai_limit" class="mb-1 block text-sm font-medium text-zinc-700">الحد اليومي (رسائل)</label>
                        <input id="daily_ai_limit" name="daily_ai_limit" type="number" min="1" value="{{ old('daily_ai_limit', $plan->daily_ai_limit) }}" required
                               class="w-full rounded-xl border border-zinc-300 px-3 py-2 text-sm">
                        @error('daily_ai_limit')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                    </div>
                    <div>
                        <label for="monthly_ai_limit" class="mb-1 block text-sm font-medium text-zinc-700">الحد الشهري (فارغ = غير محدود)</label>
                        <input id="monthly_ai_limit" name="monthly_ai_limit" type="number" min="0"
                               value="{{ old('monthly_ai_limit', $plan->monthly_ai_limit) }}"
                               class="w-full rounded-xl border border-zinc-300 px-3 py-2 text-sm">
                        @error('monthly_ai_limit')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                    </div>
                </div>

                <div>
                    <label for="features_json" class="mb-1 block text-sm font-medium text-zinc-700">المميزات (JSON — مصفوفة نصوص)</label>
                    <textarea id="features_json" name="features_json" rows="8" maxlength="20000"
                              class="w-full rounded-xl border border-zinc-300 px-3 py-2 font-mono text-xs leading-relaxed">{{ old('features_json', json_encode($plan->features ?? [], JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT)) }}</textarea>
                    @error('features_json')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                </div>
            </div>

            <div class="mt-8">
                <button type="submit" class="rounded-xl bg-madar-950 px-6 py-2.5 text-sm font-bold text-white hover:bg-madar-900">حفظ التعديلات</button>
            </div>
        </form>
    </div>
@endsection