@extends('layouts.dashboard')

@section('title', app()->getLocale() == 'ar' ? 'الإعدادات' : 'Settings')

@section('page-content')
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
    <h1 class="h2">
        <i class="bi bi-gear me-2"></i>
        {{ app()->getLocale() == 'ar' ? 'إعدادات النظام' : 'System Settings' }}
    </h1>
</div>

<!-- Settings Tabs Navigation -->
<ul class="nav nav-tabs mb-4" id="settingsTabs" role="tablist">
    <li class="nav-item" role="presentation">
        <button class="nav-link active" id="general-tab" data-bs-toggle="tab" data-bs-target="#general" type="button">
            <i class="bi bi-globe me-2"></i>
            {{ app()->getLocale() == 'ar' ? 'إعدادات عامة' : 'General Settings' }}
        </button>
    </li>
    <li class="nav-item" role="presentation">
        <button class="nav-link" id="users-tab" data-bs-toggle="tab" data-bs-target="#users" type="button">
            <i class="bi bi-person-check me-2"></i>
            {{ app()->getLocale() == 'ar' ? 'إعدادات المستخدمين' : 'User Settings' }}
        </button>
    </li>
    <li class="nav-item" role="presentation">
        <button class="nav-link" id="email-tab" data-bs-toggle="tab" data-bs-target="#email" type="button">
            <i class="bi bi-envelope me-2"></i>
            {{ app()->getLocale() == 'ar' ? 'إعدادات البريد' : 'Email Settings' }}
        </button>
    </li>
    <li class="nav-item" role="presentation">
        <button class="nav-link" id="security-tab" data-bs-toggle="tab" data-bs-target="#security" type="button">
            <i class="bi bi-shield-lock me-2"></i>
            {{ app()->getLocale() == 'ar' ? 'الأمان' : 'Security' }}
        </button>
    </li>
</ul>

<form action="{{ route('settings.update') }}" method="POST" enctype="multipart/form-data">
    @csrf
    
    <div class="tab-content" id="settingsTabContent">
        
        <!-- General Settings Tab -->
        <div class="tab-pane fade show active" id="general" role="tabpanel">
            <div class="card">
                <div class="card-header bg-white">
                    <h5 class="mb-0">
                        <i class="bi bi-globe me-2"></i>
                        {{ app()->getLocale() == 'ar' ? 'إعدادات عامة' : 'General Settings' }}
                    </h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-building me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'اسم الموقع' : 'Site Name' }}
                                <span class="text-danger">*</span>
                            </label>
                            <input type="text" name="site_name" class="form-control" value="{{ old('site_name', $settings['site_name']) }}" required>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-translate me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'اللغة الافتراضية' : 'Default Language' }}
                            </label>
                            <select name="default_language" class="form-select">
                                <option value="en" {{ $settings['default_language'] == 'en' ? 'selected' : '' }}>English</option>
                                <option value="ar" {{ $settings['default_language'] == 'ar' ? 'selected' : '' }}>العربية</option>
                            </select>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-image me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'شعار الموقع' : 'Site Logo' }}
                            </label>
                            <input type="file" name="site_logo" class="form-control" accept="image/*">
                            <small class="text-muted">
                                {{ app()->getLocale() == 'ar' ? 'يُحفظ في: public/uploads/settings/' : 'Saved to: public/uploads/settings/' }}
                            </small>
                            @if($settings['site_logo'])
                                <div class="mt-2">
                                    <img src="{{ asset($settings['site_logo']) }}" height="50" class="border rounded">
                                    <div class="form-check mt-2">
                                        <input class="form-check-input" type="checkbox" name="remove_logo" id="remove_logo" value="1">
                                        <label class="form-check-label text-danger" for="remove_logo">
                                            <i class="bi bi-trash me-1"></i>
                                            {{ app()->getLocale() == 'ar' ? 'إزالة الشعار' : 'Remove Logo' }}
                                        </label>
                                    </div>
                                </div>
                            @endif
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-list-ol me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'عدد العناصر في الصفحة' : 'Items Per Page' }}
                            </label>
                            <input type="number" name="items_per_page" class="form-control" value="{{ old('items_per_page', $settings['items_per_page']) }}" min="5" max="100">
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-12 mb-3">
                            <label class="form-label">
                                <i class="bi bi-envelope-at me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'البريد الإلكتروني للتواصل' : 'Contact Email' }}
                            </label>
                            <input type="email" name="contact_email" class="form-control" value="{{ old('contact_email', $settings['contact_email']) }}">
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">
                            <i class="bi bi-text-paragraph me-1"></i>
                            {{ app()->getLocale() == 'ar' ? 'وصف الموقع' : 'Site Description' }}
                        </label>
                        <textarea name="site_description" class="form-control" rows="3">{{ old('site_description', $settings['site_description']) }}</textarea>
                    </div>
                </div>
            </div>
        </div>
        
        <!-- User Settings Tab -->
        <div class="tab-pane fade" id="users" role="tabpanel">
            <div class="card">
                <div class="card-header bg-white">
                    <h5 class="mb-0">
                        <i class="bi bi-person-check me-2"></i>
                        {{ app()->getLocale() == 'ar' ? 'إعدادات المستخدمين' : 'User Settings' }}
                    </h5>
                </div>
                <div class="card-body">
                    <div class="mb-4">
                        <div class="form-check form-switch">
                            <input type="checkbox" name="enable_registration" class="form-check-input" id="enable_registration" 
                                {{ $settings['enable_registration'] == 'true' ? 'checked' : '' }}>
                            <label class="form-check-label" for="enable_registration">
                                <i class="bi bi-person-plus me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'السماح بتسجيل المستخدمين الجدد' : 'Enable User Registration' }}
                            </label>
                            <small class="d-block text-muted ms-4">
                                {{ app()->getLocale() == 'ar' ? 'السماح للمستخدمين الجدد بإنشاء حسابات' : 'Allow new users to create accounts' }}
                            </small>
                        </div>
                    </div>
                    
                    <div class="mb-4">
                        <div class="form-check form-switch">
                            <input type="checkbox" name="require_email_verification" class="form-check-input" id="require_email_verification" 
                                {{ $settings['require_email_verification'] == 'true' ? 'checked' : '' }}>
                            <label class="form-check-label" for="require_email_verification">
                                <i class="bi bi-envelope-check me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'طلب التحقق من البريد الإلكتروني' : 'Require Email Verification' }}
                            </label>
                            <small class="d-block text-muted ms-4">
                                {{ app()->getLocale() == 'ar' ? 'يجب على المستخدمين التحقق من بريدهم قبل تسجيل الدخول' : 'Users must verify email before logging in' }}
                            </small>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-key me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'الحد الأدنى لطول كلمة المرور' : 'Minimum Password Length' }}
                            </label>
                            <input type="number" name="min_password_length" class="form-control" value="{{ old('min_password_length', $settings['min_password_length']) }}" min="6" max="20">
                            <small class="text-muted">{{ app()->getLocale() == 'ar' ? 'الافتراضي: 8 أحرف' : 'Default: 8 characters' }}</small>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-clock-history me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'مدة انتهاء الجلسة (دقائق)' : 'Session Timeout (minutes)' }}
                            </label>
                            <input type="number" name="session_timeout" class="form-control" value="{{ old('session_timeout', $settings['session_timeout']) }}" min="5" max="1440">
                            <small class="text-muted">{{ app()->getLocale() == 'ar' ? 'الافتراضي: 120 دقيقة' : 'Default: 120 minutes' }}</small>
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">
                            <i class="bi bi-shield-check me-1"></i>
                            {{ app()->getLocale() == 'ar' ? 'دور المستخدم الافتراضي' : 'Default User Role' }}
                        </label>
                        <select name="default_user_role" class="form-select">
                            <option value="user" {{ $settings['default_user_role'] == 'user' ? 'selected' : '' }}>
                                {{ app()->getLocale() == 'ar' ? 'مستخدم عادي' : 'Regular User' }}
                            </option>
                            <option value="moderator" {{ $settings['default_user_role'] == 'moderator' ? 'selected' : '' }}>
                                {{ app()->getLocale() == 'ar' ? 'مشرف' : 'Moderator' }}
                            </option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        
        <!-- Email Settings Tab -->
        <div class="tab-pane fade" id="email" role="tabpanel">
            <div class="card">
                <div class="card-header bg-white">
                    <h5 class="mb-0">
                        <i class="bi bi-envelope me-2"></i>
                        {{ app()->getLocale() == 'ar' ? 'إعدادات البريد الإلكتروني' : 'Email Settings' }}
                    </h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-server me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'خادم SMTP' : 'SMTP Host' }}
                            </label>
                            <input type="text" name="smtp_host" class="form-control" value="{{ old('smtp_host', $settings['smtp_host']) }}" placeholder="smtp.gmail.com">
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-hdd-network me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'منفذ SMTP' : 'SMTP Port' }}
                            </label>
                            <input type="number" name="smtp_port" class="form-control" value="{{ old('smtp_port', $settings['smtp_port']) }}" placeholder="587">
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-person-badge me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'اسم مستخدم SMTP' : 'SMTP Username' }}
                            </label>
                            <input type="text" name="smtp_username" class="form-control" value="{{ old('smtp_username', $settings['smtp_username']) }}">
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-key-fill me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'كلمة مرور SMTP' : 'SMTP Password' }}
                            </label>
                            <input type="password" name="smtp_password" class="form-control" placeholder="{{ app()->getLocale() == 'ar' ? 'اتركها فارغة للإبقاء على القديمة' : 'Leave blank to keep current' }}">
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-lock me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'تشفير SMTP' : 'SMTP Encryption' }}
                            </label>
                            <select name="smtp_encryption" class="form-select">
                                <option value="tls" {{ $settings['smtp_encryption'] == 'tls' ? 'selected' : '' }}>TLS</option>
                                <option value="ssl" {{ $settings['smtp_encryption'] == 'ssl' ? 'selected' : '' }}>SSL</option>
                                <option value="" {{ $settings['smtp_encryption'] == '' ? 'selected' : '' }}>{{ app()->getLocale() == 'ar' ? 'بدون' : 'None' }}</option>
                            </select>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-envelope-paper me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'البريد الإلكتروني للمرسل' : 'From Email' }}
                            </label>
                            <input type="email" name="mail_from_address" class="form-control" value="{{ old('mail_from_address', $settings['mail_from_address']) }}">
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">
                            <i class="bi bi-person-circle me-1"></i>
                            {{ app()->getLocale() == 'ar' ? 'اسم المرسل' : 'From Name' }}
                        </label>
                        <input type="text" name="mail_from_name" class="form-control" value="{{ old('mail_from_name', $settings['mail_from_name']) }}">
                    </div>
                </div>
            </div>
        </div>
        
        <!-- Security Settings Tab -->
        <div class="tab-pane fade" id="security" role="tabpanel">
            <div class="card">
                <div class="card-header bg-white">
                    <h5 class="mb-0">
                        <i class="bi bi-shield-lock me-2"></i>
                        {{ app()->getLocale() == 'ar' ? 'إعدادات الأمان' : 'Security Settings' }}
                    </h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-x-circle me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'الحد الأقصى لمحاولات تسجيل الدخول' : 'Max Login Attempts' }}
                            </label>
                            <input type="number" name="max_login_attempts" class="form-control" value="{{ old('max_login_attempts', $settings['max_login_attempts']) }}" min="3" max="10">
                            <small class="text-muted">{{ app()->getLocale() == 'ar' ? 'الافتراضي: 5 محاولات' : 'Default: 5 attempts' }}</small>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label class="form-label">
                                <i class="bi bi-hourglass-split me-1"></i>
                                {{ app()->getLocale() == 'ar' ? 'مدة الحظر (دقائق)' : 'Lockout Duration (minutes)' }}
                            </label>
                            <input type="number" name="lockout_duration" class="form-control" value="{{ old('lockout_duration', $settings['lockout_duration']) }}" min="5" max="60">
                            <small class="text-muted">{{ app()->getLocale() == 'ar' ? 'الافتراضي: 15 دقيقة' : 'Default: 15 minutes' }}</small>
                        </div>
                    </div>
                    
                    <div class="alert alert-info">
                        <i class="bi bi-info-circle me-2"></i>
                        {{ app()->getLocale() == 'ar' ? 'سيتم حظر المستخدمين مؤقتاً بعد تجاوز الحد الأقصى لمحاولات تسجيل الدخول الفاشلة.' : 'Users will be temporarily locked out after exceeding maximum failed login attempts.' }}
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Save Button (Fixed at bottom) -->
    <div class="card mt-4">
        <div class="card-body">
            <button type="submit" class="btn btn-primary btn-lg">
                <i class="bi bi-check-circle me-2"></i>
                {{ app()->getLocale() == 'ar' ? 'حفظ جميع الإعدادات' : 'Save All Settings' }}
            </button>
            <button type="reset" class="btn btn-secondary btn-lg">
                <i class="bi bi-x-circle me-2"></i>
                {{ app()->getLocale() == 'ar' ? 'إعادة تعيين' : 'Reset' }}
            </button>
        </div>
    </div>
</form>

<!-- System Information -->
<div class="card mt-4">
    <div class="card-header bg-white">
        <h5 class="mb-0">
            <i class="bi bi-info-circle me-2"></i>
            {{ app()->getLocale() == 'ar' ? 'معلومات النظام' : 'System Information' }}
        </h5>
    </div>
    <div class="card-body">
        <div class="row">
            <div class="col-md-6">
                <p><strong>{{ app()->getLocale() == 'ar' ? 'إصدار Laravel:' : 'Laravel Version:' }}</strong> {{ app()->version() }}</p>
                <p><strong>{{ app()->getLocale() == 'ar' ? 'إصدار PHP:' : 'PHP Version:' }}</strong> {{ phpversion() }}</p>
            </div>
            <div class="col-md-6">
                <p><strong>{{ app()->getLocale() == 'ar' ? 'البيئة:' : 'Environment:' }}</strong> {{ config('app.env') }}</p>
                <p><strong>{{ app()->getLocale() == 'ar' ? 'وضع التطوير:' : 'Debug Mode:' }}</strong> {{ config('app.debug') ? (app()->getLocale() == 'ar' ? 'مفعل' : 'Enabled') : (app()->getLocale() == 'ar' ? 'معطل' : 'Disabled') }}</p>
            </div>
        </div>
    </div>
</div>
@endsection