@extends('layouts.app')
@section('title', 'الإعدادات - DOTS HR Pro')

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">إعدادات النظام</h1>
        <p class="page-subtitle">إدارة إعدادات الشركة والنظام</p>
    </div>
</div>

<div class="settings-layout">
    <div class="settings-nav">
        <a class="settings-nav-item active" onclick="showSettingsTab('company')"><i class="fas fa-building"></i> بيانات الشركة</a>
        <a class="settings-nav-item" href="{{ route('settings.departments.index') }}"><i class="fas fa-sitemap"></i> الأقسام</a>
        <a class="settings-nav-item" href="{{ route('settings.shifts') }}"><i class="fas fa-clock"></i> ورديات العمل</a>
        <a class="settings-nav-item" href="{{ route('settings.leave-types') }}"><i class="fas fa-calendar"></i> أنواع الإجازات</a>
        <a class="settings-nav-item" href="{{ route('settings.roles.index') }}"><i class="fas fa-shield-alt"></i> الأدوار والصلاحيات</a>
        <a class="settings-nav-item" href="{{ route('settings.locations.index') }}"><i class="fas fa-map-marker-alt"></i> مواقع العمل</a>
    </div>

    <div class="settings-content">
        <div class="card">
            <div class="card-header"><h3><i class="fas fa-building"></i> بيانات الشركة</h3></div>
            <div class="card-body">
                <form method="POST" action="{{ route('settings.company') }}">
                    @csrf
                    <div class="form-grid cols-2">
                        <div class="form-group">
                            <label class="form-label">اسم الشركة (عربي)</label>
                            <input type="text" name="company_name_ar" value="{{ $settings['company_name_ar'] ?? '' }}" class="form-input">
                        </div>
                        <div class="form-group">
                            <label class="form-label">اسم الشركة (إنجليزي)</label>
                            <input type="text" name="company_name_en" value="{{ $settings['company_name_en'] ?? '' }}" class="form-input">
                        </div>
                    </div>
                    <div class="form-grid cols-2">
                        <div class="form-group">
                            <label class="form-label">البريد الإلكتروني</label>
                            <input type="email" name="company_email" value="{{ $settings['company_email'] ?? '' }}" class="form-input">
                        </div>
                        <div class="form-group">
                            <label class="form-label">رقم الهاتف</label>
                            <input type="text" name="company_phone" value="{{ $settings['company_phone'] ?? '' }}" class="form-input">
                        </div>
                    </div>
                    <div class="form-grid cols-2">
                        <div class="form-group">
                            <label class="form-label">السجل التجاري</label>
                            <input type="text" name="cr_number" value="{{ $settings['cr_number'] ?? '' }}" class="form-input">
                        </div>
                        <div class="form-group">
                            <label class="form-label">الرقم الضريبي</label>
                            <input type="text" name="tax_number" value="{{ $settings['tax_number'] ?? '' }}" class="form-input">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="form-label">العنوان</label>
                        <textarea name="company_address" class="form-textarea" rows="2">{{ $settings['company_address'] ?? '' }}</textarea>
                    </div>

                    <hr style="margin: 24px 0; border-color: var(--border-color, #e5e7eb);">
                    <h4 style="margin-bottom: 16px; color: var(--text-primary, #1f2937);"><i class="fas fa-globe"></i> إعدادات الدولة والعملة</h4>

                    <div class="form-grid cols-2">
                        <div class="form-group">
                            <label class="form-label">الدولة</label>
                            <select name="country" class="form-select" onchange="updateDefaults(this.value)">
                                <option value="SA" {{ ($settings['country'] ?? 'SA') == 'SA' ? 'selected' : '' }}>المملكة العربية السعودية</option>
                                <option value="AE" {{ ($settings['country'] ?? '') == 'AE' ? 'selected' : '' }}>الإمارات العربية المتحدة</option>
                                <option value="KW" {{ ($settings['country'] ?? '') == 'KW' ? 'selected' : '' }}>الكويت</option>
                                <option value="QA" {{ ($settings['country'] ?? '') == 'QA' ? 'selected' : '' }}>قطر</option>
                                <option value="BH" {{ ($settings['country'] ?? '') == 'BH' ? 'selected' : '' }}>البحرين</option>
                                <option value="OM" {{ ($settings['country'] ?? '') == 'OM' ? 'selected' : '' }}>عُمان</option>
                                <option value="EG" {{ ($settings['country'] ?? '') == 'EG' ? 'selected' : '' }}>مصر</option>
                                <option value="JO" {{ ($settings['country'] ?? '') == 'JO' ? 'selected' : '' }}>الأردن</option>
                                <option value="LB" {{ ($settings['country'] ?? '') == 'LB' ? 'selected' : '' }}>لبنان</option>
                                <option value="IQ" {{ ($settings['country'] ?? '') == 'IQ' ? 'selected' : '' }}>العراق</option>
                                <option value="MA" {{ ($settings['country'] ?? '') == 'MA' ? 'selected' : '' }}>المغرب</option>
                                <option value="TN" {{ ($settings['country'] ?? '') == 'TN' ? 'selected' : '' }}>تونس</option>
                                <option value="PK" {{ ($settings['country'] ?? '') == 'PK' ? 'selected' : '' }}>باكستان</option>
                                <option value="IN" {{ ($settings['country'] ?? '') == 'IN' ? 'selected' : '' }}>الهند</option>
                                <option value="OTHER" {{ ($settings['country'] ?? '') == 'OTHER' ? 'selected' : '' }}>أخرى</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label class="form-label">العملة</label>
                            <select name="currency" class="form-select" id="currencySelect" onchange="updateCurrencyLabel(this.value)">
                                <option value="SAR" {{ ($settings['currency'] ?? 'SAR') == 'SAR' ? 'selected' : '' }}>ريال سعودي (SAR)</option>
                                <option value="AED" {{ ($settings['currency'] ?? '') == 'AED' ? 'selected' : '' }}>درهم إماراتي (AED)</option>
                                <option value="KWD" {{ ($settings['currency'] ?? '') == 'KWD' ? 'selected' : '' }}>دينار كويتي (KWD)</option>
                                <option value="QAR" {{ ($settings['currency'] ?? '') == 'QAR' ? 'selected' : '' }}>ريال قطري (QAR)</option>
                                <option value="BHD" {{ ($settings['currency'] ?? '') == 'BHD' ? 'selected' : '' }}>دينار بحريني (BHD)</option>
                                <option value="OMR" {{ ($settings['currency'] ?? '') == 'OMR' ? 'selected' : '' }}>ريال عُماني (OMR)</option>
                                <option value="EGP" {{ ($settings['currency'] ?? '') == 'EGP' ? 'selected' : '' }}>جنيه مصري (EGP)</option>
                                <option value="JOD" {{ ($settings['currency'] ?? '') == 'JOD' ? 'selected' : '' }}>دينار أردني (JOD)</option>
                                <option value="LBP" {{ ($settings['currency'] ?? '') == 'LBP' ? 'selected' : '' }}>ليرة لبنانية (LBP)</option>
                                <option value="IQD" {{ ($settings['currency'] ?? '') == 'IQD' ? 'selected' : '' }}>دينار عراقي (IQD)</option>
                                <option value="MAD" {{ ($settings['currency'] ?? '') == 'MAD' ? 'selected' : '' }}>درهم مغربي (MAD)</option>
                                <option value="TND" {{ ($settings['currency'] ?? '') == 'TND' ? 'selected' : '' }}>دينار تونسي (TND)</option>
                                <option value="PKR" {{ ($settings['currency'] ?? '') == 'PKR' ? 'selected' : '' }}>روبية باكستانية (PKR)</option>
                                <option value="INR" {{ ($settings['currency'] ?? '') == 'INR' ? 'selected' : '' }}>روبية هندية (INR)</option>
                                <option value="USD" {{ ($settings['currency'] ?? '') == 'USD' ? 'selected' : '' }}>دولار أمريكي (USD)</option>
                                <option value="EUR" {{ ($settings['currency'] ?? '') == 'EUR' ? 'selected' : '' }}>يورو (EUR)</option>
                                <option value="GBP" {{ ($settings['currency'] ?? '') == 'GBP' ? 'selected' : '' }}>جنيه إسترليني (GBP)</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-grid cols-2">
                        <div class="form-group">
                            <label class="form-label">رمز العملة المختصر</label>
                            <input type="text" name="currency_label" id="currencyLabel" value="{{ $settings['currency_label'] ?? 'ر.س' }}" class="form-input" placeholder="مثال: ر.س أو د.إ">
                            <small class="form-hint">يظهر بجانب المبالغ في النظام</small>
                        </div>
                        <div class="form-group">
                            <label class="form-label">نسبة التأمينات الاجتماعية (%)</label>
                            <input type="number" name="social_insurance_rate" value="{{ $settings['social_insurance_rate'] ?? '9.75' }}" class="form-input" step="0.01" min="0" max="100">
                            <small class="form-hint">النسبة المخصومة من الراتب الأساسي (السعودية: 9.75%)</small>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="form-label">مسمى التأمينات</label>
                        <input type="text" name="social_insurance_label" id="insuranceLabel" value="{{ $settings['social_insurance_label'] ?? 'التأمينات الاجتماعية (GOSI)' }}" class="form-input">
                        <small class="form-hint">مثال: GOSI (السعودية)، GPSSA (الإمارات)، PIFSS (الكويت)</small>
                    </div>

                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary"><i class="fas fa-save"></i> حفظ الإعدادات</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
const countryDefaults = {
    SA: {currency:'SAR', label:'ر.س', rate:'9.75', insurance:'التأمينات الاجتماعية (GOSI)'},
    AE: {currency:'AED', label:'د.إ', rate:'5.00', insurance:'التأمينات (GPSSA)'},
    KW: {currency:'KWD', label:'د.ك', rate:'8.00', insurance:'التأمينات (PIFSS)'},
    QA: {currency:'QAR', label:'ر.ق', rate:'5.00', insurance:'التأمينات الاجتماعية'},
    BH: {currency:'BHD', label:'د.ب', rate:'7.00', insurance:'التأمينات (SIO)'},
    OM: {currency:'OMR', label:'ر.ع', rate:'7.00', insurance:'التأمينات (PASI)'},
    EG: {currency:'EGP', label:'ج.م', rate:'11.00', insurance:'التأمينات الاجتماعية'},
    JO: {currency:'JOD', label:'د.أ', rate:'7.50', insurance:'الضمان الاجتماعي (SSC)'},
    LB: {currency:'LBP', label:'ل.ل', rate:'8.50', insurance:'الضمان الاجتماعي (NSSF)'},
    IQ: {currency:'IQD', label:'د.ع', rate:'5.00', insurance:'التأمينات الاجتماعية'},
    MA: {currency:'MAD', label:'د.م', rate:'6.29', insurance:'الضمان الاجتماعي (CNSS)'},
    TN: {currency:'TND', label:'د.ت', rate:'9.18', insurance:'الضمان الاجتماعي (CNSS)'},
    PK: {currency:'PKR', label:'Rs', rate:'1.00', insurance:'EOBI'},
    IN: {currency:'INR', label:'₹', rate:'12.00', insurance:'EPF/ESI'},
};
const currencyLabels = {
    SAR:'ر.س', AED:'د.إ', KWD:'د.ك', QAR:'ر.ق', BHD:'د.ب', OMR:'ر.ع',
    EGP:'ج.م', JOD:'د.أ', LBP:'ل.ل', IQD:'د.ع', MAD:'د.م', TND:'د.ت',
    PKR:'Rs', INR:'₹', USD:'$', EUR:'€', GBP:'£'
};
function updateDefaults(country) {
    const d = countryDefaults[country];
    if (!d) return;
    document.getElementById('currencySelect').value = d.currency;
    document.getElementById('currencyLabel').value = d.label;
    document.querySelector('[name="social_insurance_rate"]').value = d.rate;
    document.getElementById('insuranceLabel').value = d.insurance;
}
function updateCurrencyLabel(currency) {
    const label = currencyLabels[currency];
    if (label) document.getElementById('currencyLabel').value = label;
}
</script>
@endsection