@extends('layouts.master')

@section('content')
<div class="container" style="max-width: 800px;">
    <h3 style="font-weight: 800; margin-bottom: 5px;">الإعدادات</h3>
    <p style="color: #666;">إعدادات الموقع وحساب المدير</p>
    <hr>

    @include('layouts.errors')

    <div id="flash">
        @if(session('flash_notification'))
            @foreach(session('flash_notification') as $msg)
                <div class="alert alert-{{ $msg->level }}">{{ $msg->message }}</div>
            @endforeach
        @endif
    </div>

    <div style="text-align: center; margin-bottom: 1.5rem;">
        <a href="/admin/import-export" class="btn btn-success">استيراد وتصدير البيانات</a>
    </div>

    {{-- إعدادات الموقع --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">إعدادات الموقع</h5>
        <form method="POST" action="/admin/settings/site">
            @csrf
            <div class="form-group">
                <label>اسم الموقع (يظهر في العنوان):</label>
                <input type="text" class="form-control" name="site_name" value="{{ $siteSettings['site_name'] ?? 'كلمات الأغاني' }}">
            </div>

            <div class="form-group">
                <label>نص اللوجو (يظهر في الشريط العلوي):</label>
                <input type="text" class="form-control" name="site_logo_text" value="{{ $siteSettings['site_logo_text'] ?? 'كلمات' }}">
            </div>

            <button type="submit" class="btn btn-primary btn-block">حفظ إعدادات الموقع</button>
        </form>

        <form method="POST" action="/admin/settings/logo-icon" id="logoIconForm">
            @csrf
            <div class="form-group">
                <label>أيقونة الشعار (بجانب حرف أ في الهيدر):</label>
                <div style="display: flex; align-items: center; gap: 15px; margin-bottom: 8px;">
                    <img src="{{ $siteSettings['logo_icon'] ?? '/logo-icon.png' }}" alt="logo icon" style="width: 48px; height: 48px; border: 1px solid #9999CC; border-radius: 4px;">
                    <span style="color: #666; font-size: 0.85em;">الأيقونة الحالية</span>
                </div>
                <input type="file" id="logoIconFile" class="form-control-file" accept="image/png,image/x-icon,image/jpeg,image/svg+xml">
                <input type="hidden" name="logo_icon_data" id="logoIconData">
                <small style="color: #888;">PNG, ICO, JPG, SVG - حد أقصى 1MB</small>
            </div>
            <button type="submit" class="btn btn-primary btn-block">رفع أيقونة الشعار</button>
        </form>
        <script>
        document.getElementById('logoIconFile').addEventListener('change', function(e) {
            var file = e.target.files[0];
            if (file) {
                var reader = new FileReader();
                reader.onload = function(ev) {
                    document.getElementById('logoIconData').value = ev.target.result;
                };
                reader.readAsDataURL(file);
            }
        });
        </script>

        <hr style="border-color: #9999CC; margin: 1.5rem 0;">

        <form method="POST" action="/admin/settings/favicon" id="faviconForm">
            @csrf
            <div class="form-group">
                <label>أيقونة الموقع (favicon):</label>
                <div style="display: flex; align-items: center; gap: 15px; margin-bottom: 8px;">
                    <img src="{{ $siteSettings['favicon'] ?? '/favicon.png' }}" alt="favicon" style="width: 48px; height: 48px; border: 1px solid #9999CC; border-radius: 4px;">
                    <span style="color: #666; font-size: 0.85em;">الأيقونة الحالية</span>
                </div>
                <input type="file" id="faviconFile" class="form-control-file" accept="image/png,image/x-icon,image/jpeg,image/svg+xml">
                <input type="hidden" name="favicon_data" id="faviconData">
                <small style="color: #888;">PNG, ICO, JPG, SVG - حد أقصى 1MB</small>
            </div>
            <button type="submit" class="btn btn-primary btn-block">رفع أيقونة جديدة</button>
        </form>
        <script>
        document.getElementById('faviconFile').addEventListener('change', function(e) {
            var file = e.target.files[0];
            if (file) {
                var reader = new FileReader();
                reader.onload = function(ev) {
                    document.getElementById('faviconData').value = ev.target.result;
                };
                reader.readAsDataURL(file);
            }
        });
        </script>
    </div>

    {{-- إعدادات التسجيل والدخول --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">إعدادات التسجيل وتسجيل الدخول</h5>
        <form method="POST" action="/admin/settings/registration">
            @csrf
            <div class="form-group">
                <label>تسجيل الدخول وإنشاء حساب للزوار:</label>
                <select name="registration_enabled" class="form-control" style="max-width: 300px;">
                    <option value="1" {{ ($siteSettings['registration_enabled'] ?? '1') == '1' ? 'selected' : '' }}>مفعّل (مسموح)</option>
                    <option value="0" {{ ($siteSettings['registration_enabled'] ?? '1') == '0' ? 'selected' : '' }}>معطّل (مغلق)</option>
                </select>
                <small style="color: #888; display: block; margin-top: 5px;">عند التعطيل: يختفي تسجيل الدخول وحساب جديد من الزوار. الأدمن لا يتأثر (دخول خاص عبر /admin/login)</small>
            </div>
            <button type="submit" class="btn btn-primary btn-block">حفظ إعدادات التسجيل</button>
        </form>
    </div>

    {{-- إعدادات إرسال الكلمات --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">إعدادات إرسال الكلمات</h5>
        <form method="POST" action="/admin/settings/submit-lyrics">
            @csrf
            <div class="form-group">
                <label>إرسال كلمات الأغاني للزوار:</label>
                <select name="submit_lyrics_enabled" class="form-control" style="max-width: 300px;">
                    <option value="1" {{ ($siteSettings['submit_lyrics_enabled'] ?? '1') == '1' ? 'selected' : '' }}>مفعّل (مسموح)</option>
                    <option value="0" {{ ($siteSettings['submit_lyrics_enabled'] ?? '1') == '0' ? 'selected' : '' }}>معطّل (مغلق)</option>
                </select>
                <small style="color: #888; display: block; margin-top: 5px;">عند التعطيل: يختفي رابط إرسال الكلمات ولا يمكن للزوار الوصول لصفحة الإرسال</small>
            </div>

            <div class="form-group">
                <label>تصحيح كلمات الأغاني للزوار:</label>
                <select name="correction_enabled" class="form-control" style="max-width: 300px;">
                    <option value="1" {{ ($siteSettings['correction_enabled'] ?? '1') == '1' ? 'selected' : '' }}>مفعّل (مسموح)</option>
                    <option value="0" {{ ($siteSettings['correction_enabled'] ?? '1') == '0' ? 'selected' : '' }}>معطّل (مغلق)</option>
                </select>
                <small style="color: #888; display: block; margin-top: 5px;">عند التعطيل: يختفي زر تصحيح الكلمات من صفحة الأغنية</small>
            </div>

            <button type="submit" class="btn btn-primary btn-block">حفظ إعدادات الإرسال</button>
        </form>
    </div>

    {{-- إعدادات الإحصائيات --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">إعدادات إحصائيات الموقع</h5>
        <form method="POST" action="/admin/settings/stats">
            @csrf
            <div class="form-group">
                <label>عرض إحصائيات الموقع:</label>
                <select name="stats_enabled" class="form-control" style="max-width: 300px;">
                    <option value="1" {{ ($siteSettings['stats_enabled'] ?? '1') == '1' ? 'selected' : '' }}>مفعّل (ظاهر)</option>
                    <option value="0" {{ ($siteSettings['stats_enabled'] ?? '1') == '0' ? 'selected' : '' }}>معطّل (مخفي)</option>
                </select>
                <small style="color: #888; display: block; margin-top: 5px;">عند التعطيل: تختفي إحصائيات الموقع من الصفحة الرئيسية</small>
            </div>

            <div class="form-group">
                <label>عدد الأغاني:</label>
                <input type="number" min="0" name="stats_songs" class="form-control" value="{{ $siteSettings['stats_songs'] ?? '' }}" style="direction: ltr; text-align: left; max-width: 300px;" placeholder="اتركه فارغاً للحساب التلقائي">
                <small style="color: #888; display: block; margin-top: 5px;">اكتب رقماً ليُستخدم يدوياً، أو اتركه فارغاً ليُحسب تلقائياً</small>
            </div>

            <div class="form-group">
                <label>عدد الفنانين:</label>
                <input type="number" min="0" name="stats_artists" class="form-control" value="{{ $siteSettings['stats_artists'] ?? '' }}" style="direction: ltr; text-align: left; max-width: 300px;" placeholder="اتركه فارغاً للحساب التلقائي">
                <small style="color: #888; display: block; margin-top: 5px;">اكتب رقماً ليُستخدم يدوياً، أو اتركه فارغاً ليُحسب تلقائياً</small>
            </div>

            <div class="form-group">
                <label>عدد المشاهدات:</label>
                <input type="number" min="0" name="stats_views" class="form-control" value="{{ $siteSettings['stats_views'] ?? '' }}" style="direction: ltr; text-align: left; max-width: 300px;" placeholder="اتركه فارغاً للحساب التلقائي">
                <small style="color: #888; display: block; margin-top: 5px;">اكتب رقماً ليُستخدم يدوياً، أو اتركه فارغاً ليُحسب تلقائياً</small>
            </div>

            <div class="form-group">
                <label>عدد المساهمين:</label>
                <input type="number" min="0" name="stats_users" class="form-control" value="{{ $siteSettings['stats_users'] ?? '' }}" style="direction: ltr; text-align: left; max-width: 300px;" placeholder="اتركه فارغاً للحساب التلقائي">
                <small style="color: #888; display: block; margin-top: 5px;">اكتب رقماً ليُستخدم يدوياً، أو اتركه فارغاً ليُحسب تلقائياً</small>
            </div>

            <button type="submit" class="btn btn-primary btn-block">حفظ إعدادات الإحصائيات</button>
        </form>
    </div>

    {{-- إعدادات AdSense --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">إعدادات Google AdSense</h5>
        <form method="POST" action="/admin/settings/adsense">
            @csrf
            <div class="form-group">
                <label>معرّف الناشر (Publisher ID):</label>
                <input type="text" class="form-control" name="adsense_publisher_id" value="{{ $siteSettings['adsense_publisher_id'] ?? '' }}" placeholder="pub-0000000000000000" style="direction: ltr; text-align: left;">
                <small style="color: #888; display: block; margin-top: 5px;">أدخل معرّف الناشر من AdSense. سيتم تحميل سكربت AdSense تلقائياً في كل الصفحات.</small>
            </div>

            <div class="form-group">
                <label>تفعيل AdSense:</label>
                <select name="adsense_enabled" class="form-control" style="max-width: 300px;">
                    <option value="1" {{ ($siteSettings['adsense_enabled'] ?? '0') == '1' ? 'selected' : '' }}>مفعّل</option>
                    <option value="0" {{ ($siteSettings['adsense_enabled'] ?? '0') == '0' ? 'selected' : '' }}>معطّل</option>
                </select>
            </div>

            <button type="submit" class="btn btn-primary btn-block">حفظ إعدادات AdSense</button>
        </form>
    </div>

    {{-- إعدادات reCAPTCHA --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">إعدادات reCAPTCHA</h5>
        <form method="POST" action="/admin/settings/recaptcha">
            @csrf
            <div class="form-group">
                <label>تفعيل reCAPTCHA:</label>
                <select name="recaptcha_enabled" class="form-control" style="max-width: 300px;">
                    <option value="1" {{ ($siteSettings['recaptcha_enabled'] ?? '0') == '1' ? 'selected' : '' }}>مفعّل</option>
                    <option value="0" {{ ($siteSettings['recaptcha_enabled'] ?? '0') == '0' ? 'selected' : '' }}>معطّل</option>
                </select>
                <small style="color: #888; display: block; margin-top: 5px;">يظهر في صفحة إرسال الكلمات واتصل بنا</small>
            </div>
            <div class="form-group">
                <label>مفتاح الموقع (Site Key):</label>
                <input type="text" class="form-control" name="recaptcha_site_key" value="{{ $siteSettings['recaptcha_site_key'] ?? '' }}" placeholder="6Lc..." style="direction: ltr; text-align: left;">
            </div>
            <div class="form-group">
                <label>المفتاح السري (Secret Key):</label>
                <input type="text" class="form-control" name="recaptcha_secret_key" value="{{ $siteSettings['recaptcha_secret_key'] ?? '' }}" placeholder="6Lc..." style="direction: ltr; text-align: left;">
            </div>
            <small style="color: #888; display: block; margin-bottom: 10px;">احصل على المفاتيح من: <a href="https://www.google.com/recaptcha/admin" target="_blank" style="color: #7777CC;">google.com/recaptcha/admin</a> (اختر reCAPTCHA v2 - Checkbox)</small>
            <button type="submit" class="btn btn-primary btn-block">حفظ إعدادات reCAPTCHA</button>
        </form>
    </div>

    {{-- نص الترحيب في الصفحة الرئيسية --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">نص حقوق النشر (أسفل الموقع)</h5>
        <form method="POST" action="/admin/settings/copyright">
            @csrf
            <div class="form-group">
                <label>النص القانوني:</label>
                <textarea name="copyright_text" class="form-control" rows="3" placeholder="جميع الكلمات هي ملكية وحقوق نشر لأصحابها...">{{ $siteSettings['copyright_text'] ?? '' }}</textarea>
                <small style="color: #888; display: block; margin-top: 5px;">اتركه فارغاً لعرض النص الافتراضي</small>
            </div>

            <div class="form-group">
                <label>سنة البداية لحقوق النشر:</label>
                <input type="number" min="1900" max="2100" name="copyright_start_year" class="form-control" value="{{ $siteSettings['copyright_start_year'] ?? '2000' }}" style="direction: ltr; text-align: left; max-width: 200px;">
            </div>

            <button type="submit" class="btn btn-primary btn-block">حفظ حقوق النشر</button>
        </form>
    </div>

    {{-- نص الترحيب في الصفحة الرئيسية --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">نص الترحيب (الصفحة الرئيسية)</h5>
        <form method="POST" action="/admin/settings/welcome">
            @csrf
            <div class="form-group">
                <label>العنوان الرئيسي (يدعم HTML):</label>
                <input type="text" class="form-control" name="welcome_title" value="{{ $siteSettings['welcome_title'] ?? 'مرحباً بك في كلمات الأغاني!' }}" required>
            </div>

            <div class="form-group">
                <label>العنوان الفرعي:</label>
                <input type="text" class="form-control" name="welcome_subtitle" value="{{ $siteSettings['welcome_subtitle'] ?? 'المكان الذي تنتهي فيه جميع عمليات البحث!' }}" required>
            </div>

            <div class="form-group">
                <label>الوصف:</label>
                <textarea name="welcome_description" class="form-control" rows="3" required>{{ $siteSettings['welcome_description'] ?? 'لدينا عالم كبير ومتنامي يومياً من الكلمات حيث تتألق نجوم جميع الأنواع والأجيال.' }}</textarea>
            </div>

            <button type="submit" class="btn btn-primary btn-block">حفظ نص الترحيب</button>
        </form>
    </div>

    {{-- تغيير البيانات الشخصية --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem; margin-bottom: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">تغيير بيانات الحساب</h5>
        <form method="POST" action="/admin/settings/profile">
            @csrf
            <div class="form-group">
                <label>اسم المستخدم:</label>
                <input type="text" class="form-control" name="name" value="{{ $user->name }}" required>
            </div>

            <div class="form-group">
                <label>البريد الإلكتروني:</label>
                <input type="email" class="form-control" name="email" value="{{ $user->email }}" required style="direction: ltr; text-align: right;">
            </div>

            <button type="submit" class="btn btn-primary btn-block">حفظ التغييرات</button>
        </form>
    </div>

    {{-- تغيير كلمة المرور --}}
    <div style="background: #bbbbd0; border: 2px solid #9999CC; padding: 1.5rem;">
        <h5 style="color: #7777CC; font-weight: 700; margin-bottom: 1rem;">تغيير كلمة المرور</h5>
        <form method="POST" action="/admin/settings/password">
            @csrf
            <div class="form-group">
                <label>كلمة المرور الحالية:</label>
                <input type="password" class="form-control" name="current_password" required placeholder="أدخل كلمة المرور الحالية">
            </div>

            <div class="form-group">
                <label>كلمة المرور الجديدة:</label>
                <input type="password" class="form-control" name="new_password" required placeholder="أدخل كلمة المرور الجديدة (6 أحرف على الأقل)">
            </div>

            <div class="form-group">
                <label>تأكيد كلمة المرور الجديدة:</label>
                <input type="password" class="form-control" name="new_password_confirmation" required placeholder="أعد إدخال كلمة المرور الجديدة">
            </div>

            <button type="submit" class="btn btn-primary btn-block">تغيير كلمة المرور</button>
        </form>
    </div>
</div>
@endsection
