@extends('layouts.app')

@section('title', 'الإعدادات')

@section('content')
<div class="space-y-6">
    <div>
        <h1 class="text-2xl font-bold text-gray-900">الإعدادات</h1>
        <p class="text-gray-500">تخصيص إعدادات HalaVoice AI لمتجرك</p>
    </div>

    @if(!isset($store) || !$store)
        <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-8 text-center">
            <p class="text-gray-500 mb-4">يرجى ربط متجرك أولاً</p>
            <a href="{{ route('oauth.redirect') }}" class="inline-flex items-center px-4 py-2 bg-primary-600 text-white rounded-lg">ربط المتجر</a>
        </div>
    @else
        <form method="POST" action="{{ route('dashboard.settings.update') }}" class="space-y-6">
            @csrf

            <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
                <h2 class="text-lg font-semibold text-gray-900 mb-4">الإعدادات العامة</h2>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">اسم المساعد الصوتي</label>
                        <input type="text" name="assistant_name" value="{{ $settings['assistant_name'] ?? 'سارة' }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">رقم الهاتف للتواصل</label>
                        <input type="text" name="business_phone" value="{{ $settings['business_phone'] ?? '' }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">اللغة</label>
                        <select name="ai_language" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                            <option value="ar-SA" {{ ($settings['ai_language'] ?? 'ar-SA') === 'ar-SA' ? 'selected' : '' }}>العربية (السعودية)</option>
                            <option value="ar-AE" {{ ($settings['ai_language'] ?? '') === 'ar-AE' ? 'selected' : '' }}>العربية (الإمارات)</option>
                            <option value="ar-EG" {{ ($settings['ai_language'] ?? '') === 'ar-EG' ? 'selected' : '' }}>العربية (مصر)</option>
                            <option value="en" {{ ($settings['ai_language'] ?? '') === 'en' ? 'selected' : '' }}>English</option>
                        </select>
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">كود الخصم</label>
                        <input type="text" name="discount_code" value="{{ $settings['discount_code'] ?? 'WELCOME10' }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                    </div>
                </div>
            </div>

            <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
                <h2 class="text-lg font-semibold text-gray-900 mb-4">المكالمات الصوتية</h2>
                <div class="space-y-4">
                    <label class="flex items-center">
                        <input type="checkbox" name="voice_calls_enabled" value="1" {{ ($settings['voice_calls_enabled'] ?? true) ? 'checked' : '' }} class="w-5 h-5 text-primary-600 rounded">
                        <span class="mr-3 text-gray-700">تفعيل المكالمات الصوتية</span>
                    </label>
                    <label class="flex items-center">
                        <input type="checkbox" name="cod_confirmation_enabled" value="1" {{ ($settings['cod_confirmation_enabled'] ?? true) ? 'checked' : '' }} class="w-5 h-5 text-primary-600 rounded">
                        <span class="mr-3 text-gray-700">تفعيل تأكيد الطلبات النقدية</span>
                    </label>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">تأخير المكالمة (دقائق)</label>
                            <input type="number" name="call_delay_minutes" value="{{ $settings['call_delay_minutes'] ?? 5 }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">الحد الأدنى لقيمة الطلب للمكالمة</label>
                            <input type="number" name="min_cart_value_for_call" value="{{ $settings['min_cart_value_for_call'] ?? 200 }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">عدد محاولات إعادة الاتصال</label>
                            <input type="number" name="max_retry_attempts" value="{{ $settings['max_retry_attempts'] ?? 3 }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">المدة بين المحاولات (دقائق)</label>
                            <input type="number" name="retry_delay_minutes" value="{{ $settings['retry_delay_minutes'] ?? 30 }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                        </div>
                    </div>
                </div>
            </div>

            <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
                <h2 class="text-lg font-semibold text-gray-900 mb-4">الواتساب</h2>
                <div class="space-y-4">
                    <label class="flex items-center">
                        <input type="checkbox" name="whatsapp_enabled" value="1" {{ ($settings['whatsapp_enabled'] ?? true) ? 'checked' : '' }} class="w-5 h-5 text-primary-600 rounded">
                        <span class="mr-3 text-gray-700">تفعيل الواتساب</span>
                    </label>
                    <label class="flex items-center">
                        <input type="checkbox" name="shipping_notifications_enabled" value="1" {{ ($settings['shipping_notifications_enabled'] ?? true) ? 'checked' : '' }} class="w-5 h-5 text-primary-600 rounded">
                        <span class="mr-3 text-gray-700">إشعارات الشحن</span>
                    </label>
                    <label class="flex items-center">
                        <input type="checkbox" name="review_request_enabled" value="1" {{ ($settings['review_request_enabled'] ?? true) ? 'checked' : '' }} class="w-5 h-5 text-primary-600 rounded">
                        <span class="mr-3 text-gray-700">طلب تقييم بعد التوصيل</span>
                    </label>
                </div>
            </div>

            <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
                <h2 class="text-lg font-semibold text-gray-900 mb-4">العربات المتروكة</h2>
                <div class="space-y-4">
                    <label class="flex items-center">
                        <input type="checkbox" name="abandoned_cart_enabled" value="1" {{ ($settings['abandoned_cart_enabled'] ?? true) ? 'checked' : '' }} class="w-5 h-5 text-primary-600 rounded">
                        <span class="mr-3 text-gray-700">تفعيل استرداد العربات المتروكة</span>
                    </label>
                    <label class="flex items-center">
                        <input type="checkbox" name="cod_only_mode" value="1" {{ ($settings['cod_only_mode'] ?? false) ? 'checked' : '' }} class="w-5 h-5 text-primary-600 rounded">
                        <span class="mr-3 text-gray-700">الدفع عند الاستلام فقط</span>
                    </label>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 mb-1">تأخير التذكير (دقائق)</label>
                            <input type="number" name="abandoned_cart_delay_minutes" value="{{ $settings['abandoned_cart_delay_minutes'] ?? 30 }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                        </div>
                    </div>
                </div>
            </div>

            <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
                <h2 class="text-lg font-semibold text-gray-900 mb-4">إعدادات متقدمة</h2>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">رقم التحويل للبشر</label>
                        <input type="text" name="human_escalation_number" value="{{ $settings['human_escalation_number'] ?? '' }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">بداية ساعات العمل</label>
                        <input type="text" name="working_hours_start" value="{{ $settings['working_hours_start'] ?? '09:00' }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">نهاية ساعات العمل</label>
                        <input type="text" name="working_hours_end" value="{{ $settings['working_hours_end'] ?? '21:00' }}" class="w-full border border-gray-300 rounded-lg px-4 py-2">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">الاحتفاظ بالبيانات (أيام)</label>
                        <input type="number" name="data_retention_days" value="{{ $settings['data_retention_days'] ?? 90 }}" class="w-full border border-gray-300 rounded-lg px-4 py-2" min="30" max="365">
                    </div>
                </div>
            </div>

            <div class="flex justify-end">
                <button type="submit" class="px-6 py-3 bg-primary-600 text-white rounded-lg hover:bg-primary-700 font-medium">
                    حفظ الإعدادات
                </button>
            </div>
        </form>
    @endif
</div>
@endsection