@php
    $submitText = $submitText ?? 'حفظ';
    $videoInfo = $videoInfo ?? null;
@endphp

<form method="POST" action="{{ $action }}" class="space-y-6" enctype="multipart/form-data">
    @csrf
    @if(isset($method) && strtoupper($method) === 'PUT')
        @method('PUT')
    @endif

    <div>
        <label class="block font-medium text-sm text-gray-700" for="title">عنوان معلومة الفيديو</label>
        <input id="title" name="title" type="text" value="{{ old('title', $videoInfo->title ?? '') }}" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500" required>
        @error('title')<p class="text-sm text-red-600">{{ $message }}</p>@enderror
    </div>

    <div>
        <label class="block font-medium text-sm text-gray-700" for="video_url">رابط YouTube</label>
        <input id="video_url" name="video_url" type="url" value="{{ old('video_url', $videoInfo->video_url ?? '') }}" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500" placeholder="https://www.youtube.com/watch?v=..." required>
        @error('video_url')<p class="text-sm text-red-600">{{ $message }}</p>@enderror
    </div>

    <div class="grid grid-cols-1 sm:grid-cols-3 gap-4">
        <div>
            <label class="block font-medium text-sm text-gray-700" for="order">ترتيب العرض</label>
            <input id="order" name="order" type="number" min="0" value="{{ old('order', $videoInfo->order ?? 0) }}" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
            @error('order')<p class="text-sm text-red-600">{{ $message }}</p>@enderror
        </div>

        <div class="sm:col-span-2 flex items-end">
            <label class="inline-flex items-center">
                <input type="hidden" name="is_active" value="0">
                <input type="checkbox" name="is_active" value="1" {{ old('is_active', $videoInfo->is_active ?? true) == 1 ? 'checked' : '' }} class="rounded border-gray-300 text-indigo-600 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
                <span class="ms-2 text-sm text-gray-700">نشط</span>
            </label>
        </div>
    </div>

    <div class="flex items-center gap-4">
        <button type="submit" class="inline-flex items-center justify-center rounded-md bg-indigo-600 px-4 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" style="background-color: green;">{{ $submitText }}</button>
        <a href="{{ route('dashboard.video-infos.index') }}" class="text-sm text-gray-600 hover:text-gray-900">إلغاء</a>
    </div>
</form>