@php
    $canManageGeneral = auth()->user()?->canAny(['manage_settings_general', 'manage_settings', 'update_settings']) ?? false;
    $canManagePublic = auth()->user()?->canAny(['manage_settings_public_site', 'manage_settings', 'update_settings']) ?? false;
    $canManagePricing = auth()->user()?->canAny(['manage_settings_pricing', 'manage_pricing_settings']) ?? false;
    $canManageWallets = auth()->user()?->canAny(['manage_settings_wallets', 'manage_settings']) ?? false;
    $canManageRequests = auth()->user()?->canAny(['manage_settings_requests', 'manage_settings']) ?? false;
    $canManageSecurity = auth()->user()?->canAny(['manage_settings_security', 'manage_settings']) ?? false;
    $canManageMaintenance = auth()->user()?->canAny(['manage_system_maintenance', 'manage_sensitive_settings']) ?? false;
    $canManageNotifications = auth()->user()?->canAny(['manage_settings_notifications', 'manage_settings']) ?? false;
    $canManageLogs = auth()->user()?->canAny(['manage_settings_logs', 'manage_settings']) ?? false;

    $canCreateManualBackup = auth()->user()?->can('create_manual_backup') ?? false;
    $canManageBackupSchedule = auth()->user()?->can('manage_backup_schedule') ?? false;
    $canViewBackupLogs = auth()->user()?->canAny(['view_backup_logs', 'view_backup_center']) ?? false;
    $canDownloadBackupFiles = auth()->user()?->can('download_backup_files') ?? false;
    $canDeleteBackupFiles = auth()->user()?->can('delete_backup_files') ?? false;
    $canValidateRestore = auth()->user()?->can('validate_backup_before_restore') ?? false;
    $canRestoreBackup = (auth()->user()?->can('restore_backup') ?? false) && (auth()->user()?->can('approve_critical_restore') ?? false);
    $canRestoreDb = auth()->user()?->can('restore_database_backup') ?? false;
    $canRestoreFiles = auth()->user()?->can('restore_files_backup') ?? false;
    $canViewRestoreLogs = auth()->user()?->canAny(['view_restore_logs', 'view_restore_center']) ?? false;
    $canViewGoogleDrive = auth()->user()?->canAny(['view_google_drive_settings', 'manage_google_drive_backup']) ?? false;
    $canConnectGoogleDrive = auth()->user()?->can('connect_google_drive') ?? false;
    $canDisconnectGoogleDrive = auth()->user()?->can('disconnect_google_drive') ?? false;
    $canTestGoogleDrive = auth()->user()?->can('test_google_drive_connection') ?? false;
    $canViewSettingsAudit = auth()->user()?->canAny(['view_settings_audit_log', 'view_configuration_history']) ?? false;

    $defaultTranslations = \App\Models\SiteSetting::defaultAttributes();
    $translationValue = static function (string $field, string $locale) use ($siteSettings, $defaultTranslations) {
        return old(
            "{$field}.{$locale}",
            data_get($siteSettings->{$field} ?? [], $locale, data_get($defaultTranslations, "{$field}.{$locale}", ''))
        );
    };

    $tabDefinitions = [
        'general' => __('messages.settings_tab_general'),
        'public' => __('messages.settings_tab_public_site'),
        'pricing' => __('messages.settings_tab_pricing'),
        'wallets' => __('messages.settings_tab_wallets'),
        'requests' => __('messages.settings_tab_requests'),
        'security' => __('messages.settings_tab_security'),
        'notifications' => __('messages.settings_tab_notifications'),
        'logs' => __('messages.settings_tab_logs'),
        'backup' => __('messages.settings_tab_backup'),
    ];
@endphp

<x-app-layout>
    <x-slot name="header">
        <h2 class="text-2xl font-semibold text-[var(--theme-text)]">{{ __('messages.settings_center_title') }}</h2>
    </x-slot>

    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 space-y-4">
        <p class="theme-inline-muted text-sm">{{ __('messages.settings_center_subtitle') }}</p>

        <div class="theme-surface-panel p-3">
            <div class="flex flex-wrap items-center gap-2">
                @foreach ($tabDefinitions as $tabKey => $tabLabel)
                    @continue(!($tabs[$tabKey] ?? false))
                    @php $isActiveTab = $activeTab === $tabKey; @endphp
                    <a
                        href="{{ route('admin.settings-center.index', ['tab' => $tabKey]) }}"
                        class="{{ $isActiveTab ? 'theme-btn-primary text-white' : 'theme-btn-outline' }} px-3 py-2 text-sm rounded-lg"
                    >
                        {{ $tabLabel }}
                    </a>
                @endforeach
            </div>
        </div>

        @if ($activeTab === 'general' && ($tabs['general'] ?? false))
            <form method="POST" action="{{ route('admin.settings-center.general.update') }}" class="theme-surface-panel p-5 space-y-4">
                @csrf
                @method('PUT')
                <fieldset @disabled(! $canManageGeneral) class="space-y-4">
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                            <x-input-label for="default_locale" :value="__('messages.default_locale')" />
                            <select id="default_locale" name="default_locale" class="mt-1 block w-full rounded-lg theme-ring-brand">
                                @foreach ($locales as $locale)
                                    <option value="{{ $locale }}" @selected(old('default_locale', $siteSettings->default_locale) === $locale)>
                                        {{ strtoupper($locale) }}
                                    </option>
                                @endforeach
                            </select>
                            <x-input-error class="mt-2" :messages="$errors->get('default_locale')" />
                        </div>

                        <div>
                            <x-input-label for="trash_retention_days" :value="__('messages.trash_retention_days')" />
                            <x-text-input id="trash_retention_days" name="trash_retention_days" type="number" min="1" max="3650" class="mt-1 block w-full" :value="old('trash_retention_days', $siteSettings->trash_retention_days)" />
                            <p class="mt-1 text-xs text-[var(--theme-muted)]">{{ __('messages.trash_retention_days_hint') }}</p>
                            <x-input-error class="mt-2" :messages="$errors->get('trash_retention_days')" />
                        </div>

                        <div>
                            <x-input-label for="contact_email" :value="__('messages.contact_email')" />
                            <x-text-input id="contact_email" name="contact_email" type="email" class="mt-1 block w-full" :value="old('contact_email', $siteSettings->contact_email)" />
                            <x-input-error class="mt-2" :messages="$errors->get('contact_email')" />
                        </div>

                        <div>
                            <x-input-label for="contact_phone" :value="__('messages.contact_phone')" />
                            <x-text-input id="contact_phone" name="contact_phone" type="text" class="mt-1 block w-full" :value="old('contact_phone', $siteSettings->contact_phone)" />
                            <x-input-error class="mt-2" :messages="$errors->get('contact_phone')" />
                        </div>
                    </div>
                </fieldset>

                <div class="theme-alert-brand p-3 text-sm">
                    {{ __('messages.footer_developer') }} - WhatsApp 00963994806517
                </div>

                @if ($canManageGeneral)
                    <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                @endif
            </form>
        @endif

        @if ($activeTab === 'public' && ($tabs['public'] ?? false))
            <form method="POST" action="{{ route('admin.settings-center.public.update') }}" class="theme-surface-panel p-5 space-y-5">
                @csrf
                @method('PUT')
                <fieldset @disabled(! $canManagePublic) class="space-y-5">
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                            <x-input-label for="public_per_page" :value="__('messages.public_per_page')" />
                            <x-text-input id="public_per_page" name="public_per_page" type="number" min="6" max="50" class="mt-1 block w-full" :value="old('public_per_page', $siteSettings->public_per_page)" />
                            <x-input-error class="mt-2" :messages="$errors->get('public_per_page')" />
                        </div>
                        <div>
                            <x-input-label for="admin_per_page" :value="__('messages.admin_per_page')" />
                            <x-text-input id="admin_per_page" name="admin_per_page" type="number" min="10" max="100" class="mt-1 block w-full" :value="old('admin_per_page', $siteSettings->admin_per_page)" />
                            <x-input-error class="mt-2" :messages="$errors->get('admin_per_page')" />
                        </div>
                    </div>

                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="public_search_enabled" value="0">
                            <input type="checkbox" name="public_search_enabled" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('public_search_enabled', (int) $siteSettings->public_search_enabled))>
                            <span>{{ __('messages.public_search_enabled') }}</span>
                        </label>
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="display_owner_phone_public" value="0">
                            <input type="checkbox" name="display_owner_phone_public" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('display_owner_phone_public', (int) $siteSettings->display_owner_phone_public))>
                            <span>{{ __('messages.display_owner_phone_public') }}</span>
                        </label>
                    </div>

                    @foreach ($locales as $locale)
                        <div class="rounded-lg border border-[var(--theme-border)] p-4 space-y-4">
                            <h4 class="text-sm font-semibold uppercase tracking-wide text-[var(--theme-muted)]">{{ strtoupper($locale) }}</h4>
                            <div>
                                <x-input-label :for="'site_name_'.$locale" :value="__('messages.site_name')" />
                                <x-text-input :id="'site_name_'.$locale" :name="'site_name_translations['.$locale.']'" type="text" class="mt-1 block w-full" :value="$translationValue('site_name_translations', $locale)" />
                            </div>
                            <div>
                                <x-input-label :for="'site_subtitle_'.$locale" :value="__('messages.site_subtitle')" />
                                <x-text-input :id="'site_subtitle_'.$locale" :name="'site_subtitle_translations['.$locale.']'" type="text" class="mt-1 block w-full" :value="$translationValue('site_subtitle_translations', $locale)" />
                            </div>
                            <div>
                                <x-input-label :for="'about_text_'.$locale" :value="__('messages.about_text')" />
                                <textarea id="about_text_{{ $locale }}" name="about_text_translations[{{ $locale }}]" rows="6" class="mt-1 block w-full rounded-lg theme-ring-brand">{{ $translationValue('about_text_translations', $locale) }}</textarea>
                            </div>
                            <div>
                                <x-input-label :for="'join_us_text_'.$locale" :value="__('messages.join_us_text')" />
                                <textarea id="join_us_text_{{ $locale }}" name="join_us_text_translations[{{ $locale }}]" rows="6" class="mt-1 block w-full rounded-lg theme-ring-brand">{{ $translationValue('join_us_text_translations', $locale) }}</textarea>
                            </div>
                            <div>
                                <x-input-label :for="'legal_notice_'.$locale" :value="__('messages.legal_notice_text')" />
                                <textarea id="legal_notice_{{ $locale }}" name="legal_notice_translations[{{ $locale }}]" rows="3" class="mt-1 block w-full rounded-lg theme-ring-brand">{{ $translationValue('legal_notice_translations', $locale) }}</textarea>
                            </div>
                        </div>
                    @endforeach
                </fieldset>

                @if ($canManagePublic)
                    <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                @endif
            </form>
        @endif

        @if ($activeTab === 'pricing' && ($tabs['pricing'] ?? false))
            <form method="POST" action="{{ route('admin.settings-center.pricing.update') }}" class="theme-surface-panel p-5 space-y-4">
                @csrf
                @method('PUT')
                <fieldset @disabled(! $canManagePricing) class="space-y-4">
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                            <x-input-label for="car_record_price" :value="__('messages.price_car_record')" />
                            <x-text-input id="car_record_price" name="car_record_price" type="number" min="0" step="0.01" class="mt-1 block w-full" :value="old('car_record_price', $pricingSettings->car_record_price)" />
                        </div>
                        <div>
                            <x-input-label for="bike_record_price" :value="__('messages.price_bike_record')" />
                            <x-text-input id="bike_record_price" name="bike_record_price" type="number" min="0" step="0.01" class="mt-1 block w-full" :value="old('bike_record_price', $pricingSettings->bike_record_price)" />
                        </div>
                        <div>
                            <x-input-label for="phone_record_price" :value="__('messages.price_phone_record')" />
                            <x-text-input id="phone_record_price" name="phone_record_price" type="number" min="0" step="0.01" class="mt-1 block w-full" :value="old('phone_record_price', $pricingSettings->phone_record_price)" />
                        </div>
                        <div>
                            <x-input-label for="internet_device_record_price" :value="__('messages.price_internet_record')" />
                            <x-text-input id="internet_device_record_price" name="internet_device_record_price" type="number" min="0" step="0.01" class="mt-1 block w-full" :value="old('internet_device_record_price', $pricingSettings->internet_device_record_price)" />
                        </div>
                        <div>
                            <x-input-label for="currency_code" :value="__('messages.wallet_currency')" />
                            <x-text-input id="currency_code" name="currency_code" type="text" maxlength="3" class="mt-1 block w-full uppercase" :value="old('currency_code', $pricingSettings->currency_code)" />
                        </div>
                    </div>
                </fieldset>
                @if ($canManagePricing)
                    <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                @endif
            </form>
        @endif

        @if ($activeTab === 'wallets' && ($tabs['wallets'] ?? false))
            <form method="POST" action="{{ route('admin.settings-center.category.update', ['category' => 'wallets']) }}" class="theme-surface-panel p-5 space-y-4">
                @csrf
                @method('PUT')
                <fieldset @disabled(! $canManageWallets) class="space-y-4">
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="wallets[allow_manual_adjustments]" value="0">
                            <input type="checkbox" name="wallets[allow_manual_adjustments]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('wallets.allow_manual_adjustments', $system['wallets.allow_manual_adjustments'] ?? true))>
                            <span>{{ __('messages.settings_wallets_allow_manual_adjustments') }}</span>
                        </label>
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="wallets[allow_refund_on_delete]" value="0">
                            <input type="checkbox" name="wallets[allow_refund_on_delete]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('wallets.allow_refund_on_delete', $system['wallets.allow_refund_on_delete'] ?? true))>
                            <span>{{ __('messages.settings_wallets_allow_refund_on_delete') }}</span>
                        </label>
                        <div>
                            <x-input-label for="wallets_min_topup_amount" :value="__('messages.settings_wallets_min_topup_amount')" />
                            <x-text-input id="wallets_min_topup_amount" name="wallets[min_topup_amount]" type="number" min="0" class="mt-1 block w-full" :value="old('wallets.min_topup_amount', $system['wallets.min_topup_amount'] ?? 1)" />
                        </div>
                        <div>
                            <x-input-label for="wallets_max_topup_amount" :value="__('messages.settings_wallets_max_topup_amount')" />
                            <x-text-input id="wallets_max_topup_amount" name="wallets[max_topup_amount]" type="number" min="1" class="mt-1 block w-full" :value="old('wallets.max_topup_amount', $system['wallets.max_topup_amount'] ?? 100000)" />
                        </div>
                    </div>
                </fieldset>
                @if ($canManageWallets)
                    <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                @endif
            </form>
        @endif

        @if ($activeTab === 'requests' && ($tabs['requests'] ?? false))
            <form method="POST" action="{{ route('admin.settings-center.category.update', ['category' => 'requests']) }}" class="theme-surface-panel p-5 space-y-4">
                @csrf
                @method('PUT')
                <fieldset @disabled(! $canManageRequests) class="space-y-4">
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="requests[require_rejection_reason]" value="0">
                            <input type="checkbox" name="requests[require_rejection_reason]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('requests.require_rejection_reason', $system['requests.require_rejection_reason'] ?? true))>
                            <span>{{ __('messages.settings_requests_require_rejection_reason') }}</span>
                        </label>
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="requests[allow_appeals]" value="0">
                            <input type="checkbox" name="requests[allow_appeals]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('requests.allow_appeals', $system['requests.allow_appeals'] ?? true))>
                            <span>{{ __('messages.settings_requests_allow_appeals') }}</span>
                        </label>
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="requests[super_admin_only_appeal_review]" value="0">
                            <input type="checkbox" name="requests[super_admin_only_appeal_review]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('requests.super_admin_only_appeal_review', $system['requests.super_admin_only_appeal_review'] ?? true))>
                            <span>{{ __('messages.settings_requests_super_admin_only_appeal_review') }}</span>
                        </label>
                        <div>
                            <x-input-label for="requests_default_submission_mode" :value="__('messages.settings_requests_default_submission_mode')" />
                            @php $modeValue = old('requests.default_submission_mode', $system['requests.default_submission_mode'] ?? 'review'); @endphp
                            <select id="requests_default_submission_mode" name="requests[default_submission_mode]" class="mt-1 block w-full rounded-lg theme-ring-brand">
                                <option value="review" @selected($modeValue === 'review')>{{ __('messages.record_request_mode_review') }}</option>
                                <option value="direct_publish" @selected($modeValue === 'direct_publish')>{{ __('messages.record_request_mode_direct_publish') }}</option>
                            </select>
                        </div>
                    </div>
                </fieldset>
                @if ($canManageRequests)
                    <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                @endif
            </form>
        @endif

        @if ($activeTab === 'security' && ($tabs['security'] ?? false))
            <div class="space-y-4">
                <form method="POST" action="{{ route('admin.settings-center.category.update', ['category' => 'security']) }}" class="theme-surface-panel p-5 space-y-4">
                    @csrf
                    @method('PUT')
                    <fieldset @disabled(! $canManageSecurity) class="space-y-4">
                        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                            <div>
                                <x-input-label for="security_session_lifetime_minutes" :value="__('messages.settings_security_session_lifetime_minutes')" />
                                <x-text-input id="security_session_lifetime_minutes" name="security[session_lifetime_minutes]" type="number" min="5" max="1440" class="mt-1 block w-full" :value="old('security.session_lifetime_minutes', $system['security.session_lifetime_minutes'] ?? 120)" />
                            </div>
                            <div>
                                <x-input-label for="security_max_login_attempts" :value="__('messages.settings_security_max_login_attempts')" />
                                <x-text-input id="security_max_login_attempts" name="security[max_login_attempts]" type="number" min="1" max="20" class="mt-1 block w-full" :value="old('security.max_login_attempts', $system['security.max_login_attempts'] ?? 5)" />
                            </div>
                            <div>
                                <x-input-label for="security_lockout_minutes" :value="__('messages.settings_security_lockout_minutes')" />
                                <x-text-input id="security_lockout_minutes" name="security[lockout_minutes]" type="number" min="1" max="120" class="mt-1 block w-full" :value="old('security.lockout_minutes', $system['security.lockout_minutes'] ?? 1)" />
                            </div>
                            <label class="inline-flex items-center gap-2 mt-7">
                                <input type="hidden" name="security[two_factor_enabled]" value="0">
                                <input type="checkbox" name="security[two_factor_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('security.two_factor_enabled', $system['security.two_factor_enabled'] ?? false))>
                                <span>{{ __('messages.settings_security_two_factor_enabled') }}</span>
                            </label>
                        </div>
                    </fieldset>
                    @if ($canManageSecurity)
                        <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                    @endif
                </form>

                <form method="POST" action="{{ route('admin.settings-center.category.update', ['category' => 'maintenance']) }}" class="theme-surface-panel p-5 space-y-4">
                    @csrf
                    @method('PUT')
                    <fieldset @disabled(! $canManageMaintenance) class="space-y-4">
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="maintenance[enabled]" value="0">
                            <input type="checkbox" name="maintenance[enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('maintenance.enabled', $system['maintenance.enabled'] ?? false))>
                            <span>{{ __('messages.settings_maintenance_enabled') }}</span>
                        </label>
                        <div>
                            <x-input-label for="maintenance_message" :value="__('messages.settings_maintenance_message')" />
                            <textarea id="maintenance_message" name="maintenance[message]" rows="4" class="mt-1 block w-full rounded-lg theme-ring-brand">{{ old('maintenance.message', $system['maintenance.message'] ?? '') }}</textarea>
                        </div>
                    </fieldset>
                    @if ($canManageMaintenance)
                        <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                    @endif
                </form>
            </div>
        @endif

        @if ($activeTab === 'notifications' && ($tabs['notifications'] ?? false))
            <form method="POST" action="{{ route('admin.settings-center.category.update', ['category' => 'notifications']) }}" class="theme-surface-panel p-5 space-y-4">
                @csrf
                @method('PUT')
                <fieldset @disabled(! $canManageNotifications) class="space-y-4">
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="notifications[in_app_enabled]" value="0">
                            <input type="checkbox" name="notifications[in_app_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('notifications.in_app_enabled', $system['notifications.in_app_enabled'] ?? true))>
                            <span>{{ __('messages.settings_notifications_in_app_enabled') }}</span>
                        </label>
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="notifications[email_enabled]" value="0">
                            <input type="checkbox" name="notifications[email_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('notifications.email_enabled', $system['notifications.email_enabled'] ?? false))>
                            <span>{{ __('messages.settings_notifications_email_enabled') }}</span>
                        </label>
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="notifications[notify_on_submission]" value="0">
                            <input type="checkbox" name="notifications[notify_on_submission]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('notifications.notify_on_submission', $system['notifications.notify_on_submission'] ?? true))>
                            <span>{{ __('messages.settings_notifications_on_submission') }}</span>
                        </label>
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="notifications[notify_on_sighting]" value="0">
                            <input type="checkbox" name="notifications[notify_on_sighting]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('notifications.notify_on_sighting', $system['notifications.notify_on_sighting'] ?? true))>
                            <span>{{ __('messages.settings_notifications_on_sighting') }}</span>
                        </label>
                        <label class="inline-flex items-center gap-2">
                            <input type="hidden" name="notifications[notify_on_duplicate]" value="0">
                            <input type="checkbox" name="notifications[notify_on_duplicate]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('notifications.notify_on_duplicate', $system['notifications.notify_on_duplicate'] ?? true))>
                            <span>{{ __('messages.settings_notifications_on_duplicate') }}</span>
                        </label>
                    </div>
                </fieldset>
                @if ($canManageNotifications)
                    <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                @endif
            </form>
        @endif

        @if ($activeTab === 'logs' && ($tabs['logs'] ?? false))
            <div class="space-y-4">
                <form method="POST" action="{{ route('admin.settings-center.category.update', ['category' => 'logs']) }}" class="theme-surface-panel p-5 space-y-4">
                    @csrf
                    @method('PUT')
                    <fieldset @disabled(! $canManageLogs) class="space-y-4">
                        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                            <label class="inline-flex items-center gap-2">
                                <input type="hidden" name="logs[settings_audit_enabled]" value="0">
                                <input type="checkbox" name="logs[settings_audit_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('logs.settings_audit_enabled', $system['logs.settings_audit_enabled'] ?? true))>
                                <span>{{ __('messages.settings_logs_settings_audit_enabled') }}</span>
                            </label>
                            <label class="inline-flex items-center gap-2">
                                <input type="hidden" name="logs[backup_audit_enabled]" value="0">
                                <input type="checkbox" name="logs[backup_audit_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('logs.backup_audit_enabled', $system['logs.backup_audit_enabled'] ?? true))>
                                <span>{{ __('messages.settings_logs_backup_audit_enabled') }}</span>
                            </label>
                            <label class="inline-flex items-center gap-2">
                                <input type="hidden" name="logs[configuration_history_enabled]" value="0">
                                <input type="checkbox" name="logs[configuration_history_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('logs.configuration_history_enabled', $system['logs.configuration_history_enabled'] ?? true))>
                                <span>{{ __('messages.settings_logs_configuration_history_enabled') }}</span>
                            </label>
                            <div>
                                <x-input-label for="logs_retention_days" :value="__('messages.settings_logs_retention_days')" />
                                <x-text-input id="logs_retention_days" name="logs[retention_days]" type="number" min="7" max="3650" class="mt-1 block w-full" :value="old('logs.retention_days', $system['logs.retention_days'] ?? 90)" />
                            </div>
                        </div>
                    </fieldset>
                    @if ($canManageLogs)
                        <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                    @endif
                </form>

                <div class="theme-surface-panel p-5 space-y-4">
                    <h3 class="text-lg font-semibold">{{ __('messages.settings_compatibility_map') }}</h3>
                    <div class="overflow-x-auto">
                        <table class="min-w-full text-sm">
                            <thead class="theme-table-head">
                                <tr>
                                    <th class="px-3 py-2 text-start">{{ __('messages.section') }}</th>
                                    <th class="px-3 py-2 text-start">{{ __('messages.source') }}</th>
                                    <th class="px-3 py-2 text-start">{{ __('messages.endpoint') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($compatibilityMap as $row)
                                    <tr class="border-b border-[var(--theme-border)]">
                                        <td class="px-3 py-2">{{ $row['section'] }}</td>
                                        <td class="px-3 py-2">{{ $row['source'] }}</td>
                                        <td class="px-3 py-2 break-all">{{ $row['endpoint'] }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="3" class="px-3 py-3 text-[var(--theme-muted)]">{{ __('messages.no_data') }}</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>

                @if ($canViewSettingsAudit)
                    <div class="theme-surface-panel p-5 space-y-4">
                        <h3 class="text-lg font-semibold">{{ __('messages.settings_audit_log_title') }}</h3>
                        <div class="overflow-x-auto">
                            <table class="min-w-full text-sm">
                                <thead class="theme-table-head">
                                    <tr>
                                        <th class="px-3 py-2 text-start">{{ __('messages.created_at') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.user') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.category') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.key') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.action') }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($settingsAuditLogs as $log)
                                        <tr class="border-b border-[var(--theme-border)]">
                                            <td class="px-3 py-2">{{ optional($log->created_at)->format('Y-m-d H:i') }}</td>
                                            <td class="px-3 py-2">{{ $log->user?->name ?? __('messages.not_available') }}</td>
                                            <td class="px-3 py-2">{{ $log->category }}</td>
                                            <td class="px-3 py-2">{{ $log->setting_key }}</td>
                                            <td class="px-3 py-2">{{ $log->action }}</td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="5" class="px-3 py-3 text-[var(--theme-muted)]">{{ __('messages.no_data') }}</td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                @endif
            </div>
        @endif

        @if ($activeTab === 'backup' && ($tabs['backup'] ?? false))
            <div class="space-y-4">
                @if ($canCreateManualBackup)
                    <form method="POST" action="{{ route('admin.settings-center.backup.run') }}" class="theme-surface-panel p-5 space-y-4">
                        @csrf
                        <h3 class="text-lg font-semibold">{{ __('messages.backup_manual_run_title') }}</h3>
                        <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                            <div>
                                <x-input-label for="backup_type" :value="__('messages.type')" />
                                <select id="backup_type" name="backup_type" class="mt-1 block w-full rounded-lg theme-ring-brand">
                                    <option value="full">{{ __('messages.backup_type_full') }}</option>
                                    <option value="database">{{ __('messages.backup_type_database') }}</option>
                                    <option value="files">{{ __('messages.backup_type_files') }}</option>
                                </select>
                            </div>
                            <div class="md:col-span-2">
                                <x-input-label for="backup_note" :value="__('messages.notes')" />
                                <x-text-input id="backup_note" name="note" type="text" class="mt-1 block w-full" :value="old('note')" />
                            </div>
                        </div>
                        <x-primary-button>{{ __('messages.backup_run_now') }}</x-primary-button>
                    </form>
                @endif

                @if ($canManageBackupSchedule)
                    <form method="POST" action="{{ route('admin.settings-center.backup.config.update') }}" class="theme-surface-panel p-5 space-y-4">
                        @csrf
                        @method('PUT')
                        <h3 class="text-lg font-semibold">{{ __('messages.backup_settings_title') }}</h3>
                        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                            <label class="inline-flex items-center gap-2">
                                <input type="hidden" name="backup[local_enabled]" value="0">
                                <input type="checkbox" name="backup[local_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('backup.local_enabled', $system['backup.local_enabled'] ?? true))>
                                <span>{{ __('messages.backup_local_enabled') }}</span>
                            </label>
                            <label class="inline-flex items-center gap-2">
                                <input type="hidden" name="backup[google_drive_enabled]" value="0">
                                <input type="checkbox" name="backup[google_drive_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('backup.google_drive_enabled', $system['backup.google_drive_enabled'] ?? false))>
                                <span>{{ __('messages.backup_google_drive_enabled') }}</span>
                            </label>
                            <label class="inline-flex items-center gap-2">
                                <input type="hidden" name="backup[schedule_enabled]" value="0">
                                <input type="checkbox" name="backup[schedule_enabled]" value="1" class="rounded border-[var(--theme-border)]" @checked((bool) old('backup.schedule_enabled', $system['backup.schedule_enabled'] ?? true))>
                                <span>{{ __('messages.backup_schedule_enabled') }}</span>
                            </label>
                            <div>
                                <x-input-label for="backup_schedule_frequency" :value="__('messages.backup_schedule_frequency')" />
                                @php $scheduleFrequency = old('backup.schedule_frequency', $system['backup.schedule_frequency'] ?? 'daily'); @endphp
                                <select id="backup_schedule_frequency" name="backup[schedule_frequency]" class="mt-1 block w-full rounded-lg theme-ring-brand">
                                    <option value="daily" @selected($scheduleFrequency === 'daily')>{{ __('messages.backup_frequency_daily') }}</option>
                                    <option value="every_12_hours" @selected($scheduleFrequency === 'every_12_hours')>{{ __('messages.backup_frequency_every_12_hours') }}</option>
                                    <option value="weekly" @selected($scheduleFrequency === 'weekly')>{{ __('messages.backup_frequency_weekly') }}</option>
                                </select>
                            </div>
                            <div>
                                <x-input-label for="backup_schedule_time" :value="__('messages.backup_schedule_time')" />
                                <x-text-input id="backup_schedule_time" name="backup[schedule_time]" type="time" class="mt-1 block w-full" :value="old('backup.schedule_time', $system['backup.schedule_time'] ?? '03:30')" />
                            </div>
                            <div>
                                <x-input-label for="backup_retention_count" :value="__('messages.backup_retention_count')" />
                                <x-text-input id="backup_retention_count" name="backup[retention_count]" type="number" min="1" max="365" class="mt-1 block w-full" :value="old('backup.retention_count', $system['backup.retention_count'] ?? 30)" />
                            </div>
                            <div>
                                <x-input-label for="backup_content_mode" :value="__('messages.backup_content_mode')" />
                                @php $contentMode = old('backup.content_mode', $system['backup.content_mode'] ?? 'db_files'); @endphp
                                <select id="backup_content_mode" name="backup[content_mode]" class="mt-1 block w-full rounded-lg theme-ring-brand">
                                    <option value="db_files" @selected($contentMode === 'db_files')>{{ __('messages.backup_content_mode_db_files') }}</option>
                                    <option value="database" @selected($contentMode === 'database')>{{ __('messages.backup_type_database') }}</option>
                                    <option value="files" @selected($contentMode === 'files')>{{ __('messages.backup_type_files') }}</option>
                                </select>
                            </div>
                            <div class="md:col-span-2">
                                <x-input-label for="backup_google_drive_folder_id" :value="__('messages.backup_google_drive_folder_id')" />
                                <x-text-input id="backup_google_drive_folder_id" name="backup[google_drive_folder_id]" type="text" class="mt-1 block w-full" :value="old('backup.google_drive_folder_id', $system['backup.google_drive_folder_id'] ?? '')" />
                            </div>
                        </div>
                        <x-primary-button>{{ __('messages.save_settings') }}</x-primary-button>
                    </form>
                @endif

                @if ($canViewGoogleDrive)
                    <div class="theme-surface-panel p-5 space-y-4">
                        <h3 class="text-lg font-semibold">{{ __('messages.google_drive_settings_title') }}</h3>
                        <p class="text-sm text-[var(--theme-muted)]">
                            {{ __('messages.google_drive_connected_status') }}:
                            <span class="font-semibold">{{ ($system['backup.google_drive_connected'] ?? false) ? __('messages.yes') : __('messages.no') }}</span>
                        </p>

                        @if ($canConnectGoogleDrive)
                            <form method="POST" action="{{ route('admin.settings-center.backup.google-drive.connect') }}" class="space-y-3">
                                @csrf
                                <div>
                                    <x-input-label for="service_account_json" :value="__('messages.google_drive_service_account_json')" />
                                    <textarea id="service_account_json" name="service_account_json" rows="6" class="mt-1 block w-full rounded-lg theme-ring-brand">{{ old('service_account_json') }}</textarea>
                                </div>
                                <div>
                                    <x-input-label for="folder_id" :value="__('messages.backup_google_drive_folder_id')" />
                                    <x-text-input id="folder_id" name="folder_id" type="text" class="mt-1 block w-full" :value="old('folder_id', $system['backup.google_drive_folder_id'] ?? '')" />
                                </div>
                                <x-primary-button>{{ __('messages.google_drive_connect') }}</x-primary-button>
                            </form>
                        @endif

                        <div class="flex flex-wrap items-center gap-2">
                            @if ($canTestGoogleDrive)
                                <form method="POST" action="{{ route('admin.settings-center.backup.google-drive.test') }}">
                                    @csrf
                                    <button type="submit" class="theme-btn-outline">{{ __('messages.google_drive_test_connection') }}</button>
                                </form>
                            @endif
                            @if ($canDisconnectGoogleDrive)
                                <form method="POST" action="{{ route('admin.settings-center.backup.google-drive.disconnect') }}">
                                    @csrf
                                    <button type="submit" class="theme-btn-outline">{{ __('messages.google_drive_disconnect') }}</button>
                                </form>
                            @endif
                        </div>
                    </div>
                @endif

                @if ($canViewBackupLogs)
                    <div class="theme-surface-panel p-5 space-y-4">
                        <h3 class="text-lg font-semibold">{{ __('messages.backup_runs_title') }}</h3>
                        <div class="overflow-x-auto">
                            <table class="min-w-full text-sm">
                                <thead class="theme-table-head">
                                    <tr>
                                        <th class="px-3 py-2 text-start">#</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.type') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.status') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.created_at') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.actions') }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse ($backupRuns as $run)
                                        <tr class="border-b border-[var(--theme-border)]">
                                            <td class="px-3 py-2">{{ $run->id }}</td>
                                            <td class="px-3 py-2">{{ $run->backup_type }}</td>
                                            <td class="px-3 py-2">{{ $run->status }}</td>
                                            <td class="px-3 py-2">{{ optional($run->created_at)->format('Y-m-d H:i') }}</td>
                                            <td class="px-3 py-2">
                                                <div class="flex flex-wrap items-center gap-2">
                                                    @if ($canDownloadBackupFiles && $run->archive_path)
                                                        <a href="{{ route('admin.settings-center.backup.download', $run) }}" class="theme-btn-outline !py-1.5 !px-2 text-xs">{{ __('messages.download') }}</a>
                                                    @endif
                                                    @if ($canDeleteBackupFiles)
                                                        <form method="POST" action="{{ route('admin.settings-center.backup.delete', $run) }}" data-confirm="{{ __('messages.backup_delete_confirm') }}" data-confirm-keyword="DELETE|حذف نهائي">
                                                            @csrf
                                                            @method('DELETE')
                                                            <button type="submit" class="theme-btn-outline !py-1.5 !px-2 text-xs">{{ __('messages.delete') }}</button>
                                                        </form>
                                                    @endif
                                                    @if ($canValidateRestore)
                                                        <form method="POST" action="{{ route('admin.settings-center.backup.restore.validate', $run) }}">
                                                            @csrf
                                                            <input type="hidden" name="restore_type" value="{{ ($canRestoreDb && $canRestoreFiles) ? 'both' : ($canRestoreDb ? 'database' : 'files') }}">
                                                            <button type="submit" class="theme-btn-outline !py-1.5 !px-2 text-xs">{{ __('messages.backup_validate_restore') }}</button>
                                                        </form>
                                                    @endif
                                                    @if ($canRestoreBackup)
                                                        <form method="POST" action="{{ route('admin.settings-center.backup.restore', $run) }}" data-confirm="{{ __('messages.backup_restore_confirm') }}" data-confirm-keyword="RESTORE|استرجاع">
                                                            @csrf
                                                            <input type="hidden" name="restore_type" value="{{ ($canRestoreDb && $canRestoreFiles) ? 'both' : ($canRestoreDb ? 'database' : 'files') }}">
                                                            <button type="submit" class="theme-btn-primary !py-1.5 !px-2 text-xs">{{ __('messages.restore') }}</button>
                                                        </form>
                                                    @endif
                                                </div>
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="5" class="px-3 py-3 text-[var(--theme-muted)]">{{ __('messages.no_data') }}</td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                @endif

                @if ($canViewRestoreLogs)
                    <div class="theme-surface-panel p-5 space-y-4">
                        <h3 class="text-lg font-semibold">{{ __('messages.restore_logs_title') }}</h3>
                        <div class="overflow-x-auto">
                            <table class="min-w-full text-sm">
                                <thead class="theme-table-head">
                                    <tr>
                                        <th class="px-3 py-2 text-start">#</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.type') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.status') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.user') }}</th>
                                        <th class="px-3 py-2 text-start">{{ __('messages.created_at') }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse ($restoreLogs as $log)
                                        <tr class="border-b border-[var(--theme-border)]">
                                            <td class="px-3 py-2">{{ $log->id }}</td>
                                            <td class="px-3 py-2">{{ $log->restore_type }}</td>
                                            <td class="px-3 py-2">{{ $log->status }}</td>
                                            <td class="px-3 py-2">{{ $log->restoredBy?->name ?? __('messages.not_available') }}</td>
                                            <td class="px-3 py-2">{{ optional($log->created_at)->format('Y-m-d H:i') }}</td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="5" class="px-3 py-3 text-[var(--theme-muted)]">{{ __('messages.no_data') }}</td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                @endif
            </div>
        @endif
    </div>
</x-app-layout>