@extends('admin.layouts.app')

@section('title', 'قائمة الأسعار')

@section('content')
    <h1 class="text-3xl font-bold text-gray-800 mb-8">إدارة قائمة الأسعار</h1>

    <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
        <!-- Upload PDF -->
        <div class="bg-white rounded-lg shadow-md p-6">
            <h2 class="text-xl font-bold text-gray-800 mb-4">ملف PDF</h2>

            @if ($priceListPdf)
                <div class="mb-4 p-4 bg-gray-100 rounded-lg">
                    <p class="text-gray-600 mb-2">الملف الحالي:</p>
                    <a href="{{ asset('storage/' . $priceListPdf) }}" target="_blank"
                        class="text-zelight-red hover:text-zelight-crimson flex items-center">
                        <svg class="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                d="M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z">
                            </path>
                        </svg>
                        عرض قائمة الأسعار
                    </a>
                </div>
            @else
                <p class="text-gray-400 mb-4">لم يتم رفع ملف PDF بعد</p>
            @endif

            <form action="{{ route('admin.content.update.price-list') }}" method="POST" enctype="multipart/form-data">
                @csrf
                <div class="mb-4">
                    <label class="block text-gray-700 font-semibold mb-2">رفع ملف جديد</label>
                    <input type="file" name="price_list_pdf" accept=".pdf" required
                        class="w-full border border-gray-300 rounded-lg p-2">
                    @error('price_list_pdf')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                <button type="submit"
                    class="bg-zelight-red text-white px-4 py-2 rounded-lg hover:bg-zelight-crimson transition-colors">
                    تحديث الملف
                </button>
            </form>
        </div>

        <!-- Update Texts -->
        <div class="bg-white rounded-lg shadow-md p-6">
            <h2 class="text-xl font-bold text-gray-800 mb-4">النصوص المرافقة</h2>

            <form action="{{ route('admin.content.update.texts') }}" method="POST">
                @csrf

                <div class="grid grid-cols-2 gap-4 mb-4">
                    <div>
                        <label class="block text-gray-700 font-semibold mb-2">العنوان (عربي)</label>
                        <input type="text" name="price_list_title_ar" value="{{ $priceListTitleAr }}"
                            class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:border-zelight-red">
                    </div>
                    <div>
                        <label class="block text-gray-700 font-semibold mb-2">العنوان (إنجليزي)</label>
                        <input type="text" name="price_list_title_en" value="{{ $priceListTitleEn }}"
                            class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:border-zelight-red">
                    </div>
                </div>

                <div class="grid grid-cols-2 gap-4 mb-4">
                    <div>
                        <label class="block text-gray-700 font-semibold mb-2">الوصف (عربي)</label>
                        <textarea name="price_list_desc_ar" rows="3"
                            class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:border-zelight-red">{{ $priceListDescAr }}</textarea>
                    </div>
                    <div>
                        <label class="block text-gray-700 font-semibold mb-2">الوصف (إنجليزي)</label>
                        <textarea name="price_list_desc_en" rows="3"
                            class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:border-zelight-red">{{ $priceListDescEn }}</textarea>
                    </div>
                </div>

                <button type="submit"
                    class="bg-zelight-brown text-white px-4 py-2 rounded-lg hover:bg-opacity-90 transition-colors">
                    حفظ النصوص
                </button>
            </form>
        </div>
    </div>
@endsection