@extends('layouts.admin')
@section('content')
@php use App\Support\Ui; @endphp
{{-- Helper macros for the settings page (mockup fieldRow / toggle / select / masked input) --}}
@php
$fname = fn(string $key) => str_replace('.', '__', $key);
$row = function(string $label, string $desc, string $control) {
    return '<div class="field-row"><div><div class="field-label">'.e($label).'</div>'.($desc ? '<div class="field-desc">'.e($desc).'</div>' : '').'</div><div class="field-control">'.$control.'</div></div>';
};
$toggle = function(string $key) use ($s, $fname) {
    $on = $s->bool($key);
    return '<label class="toggle"><input type="hidden" name="'.$fname($key).'" value="0"><input type="checkbox" name="'.$fname($key).'" value="1" '.($on?'checked':'').'><span class="toggle-track"><span class="toggle-thumb"></span></span></label>';
};
$select = function(string $key, array $options) use ($s, $fname) {
    $cur = (string) $s->get($key);
    $h = '<select class="field-select" name="'.$fname($key).'">';
    foreach ($options as $o) { $h .= '<option '.($o === $cur ? 'selected' : '').' value="'.e($o).'">'.e($o).'</option>'; }
    return $h.'</select>';
};
$text = function(string $key, string $type = 'text') use ($s, $fname) {
    return '<input class="field-input editable" type="'.$type.'" name="'.$fname($key).'" value="'.e((string) $s->get($key)).'">';
};
$secret = function(string $key) use ($s, $fname) {
    return '<input class="field-input editable" type="password" name="'.$fname($key).'" value="" placeholder="'.e($s->masked($key)).'" autocomplete="new-password">';
};
$conn = fn(bool $on, ?string $label = null) => '<span class="conn-status '.($on?'on':'off').'"><span class="conn-dot"></span>'.e($label ?? ($on ? 'Connected' : 'Not connected')).'</span>';
$save = fn(string $panel) => '<div style="display:flex;justify-content:flex-end;padding:4px 0 8px;"><button class="btn btn-primary btn-sm" type="submit">'.\App\Support\Ui::icon('check').' Save '.$panel.'</button></div>';
@endphp
<div class="grid g-kpi" style="margin-bottom:20px;">
  @foreach($kpis as $k)@include('admin.partials.kpi', ['k' => $k])@endforeach
</div>
<div class="settings-layout">
  <div class="settings-nav" id="settingsNav">
    @foreach([['general','General','gear'],['payments','Payments','card'],['sms','SMS & Notifications','bolt'],['maps','Maps & Geolocation','globe'],['social','Social Login','users'],['security','Security','shield']] as [$id,$label,$ic])
      <button type="button" class="settings-nav-item {{ $loop->first ? 'active' : '' }}" data-panel="{{ $id }}">{!! Ui::icon($ic) !!}<span>{{ $label }}</span></button>
    @endforeach
  </div>
  <div class="settings-panels" id="settingsPanels">

    {{-- GENERAL --}}
    <div class="settings-panel active" data-panel="general">
      <form method="post" action="{{ route('admin.settings.save', 'general') }}">@csrf
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Platform identity</h3><p>Core details shown across the web app, mobile apps and emails.</p></div></div>
          {!! $row('Platform name', 'Displayed in the header, emails and SMS sender templates.', $text('general.platform_name')) !!}
          {!! $row('Support email', 'Where user enquiries and escalations are routed.', $text('general.support_email', 'email')) !!}
          {!! $row('Default currency', 'Used for pricing display when a user has no regional override.', $select('general.default_currency', ['USD','KES','TZS'])) !!}
          {!! $row('Timezone', 'Used for scheduling, reports and election windows.', $select('general.timezone', ['Africa/Nairobi','Africa/Dar_es_Salaam','UTC'])) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Localisation</h3><p>Languages available to end users, per the Multi-Language &amp; Accessibility module.</p></div></div>
          {!! $row('English', 'Default platform language.', $toggle('general.lang_en')) !!}
          {!! $row('Swahili', 'Available at launch across web and SMS templates.', $toggle('general.lang_sw')) !!}
          {!! $row('Low-bandwidth Lite Mode', 'Serves a lighter web experience on slow connections.', $toggle('general.lite_mode')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Maintenance</h3><p>Temporarily take the public platform offline for maintenance.</p></div></div>
          {!! $row('Maintenance mode', 'Shows a maintenance page to all non-admin users when enabled.', $toggle('general.maintenance_mode')) !!}
          {!! $row('Sample-data banner', 'Shows the “SAMPLE DATA · PRE-LAUNCH” pill in the console header.', $toggle('general.demo_mode')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Module roadmap</h3><p>Status shown on the dashboard module map and adoption bars.</p></div></div>
          @foreach($modules as $m)
            @php $cur = $moduleOverrides[$m['key']] ?? $m['status']; @endphp
            <div class="field-row"><div><div class="field-label">{{ $m['name'] }}</div><div class="field-desc">{{ $m['group'] }}</div></div><div class="field-control"><select class="field-select" name="general__module_status[{{ $m['key'] }}]">@foreach(['live'=>'Live','beta'=>'Beta','planned'=>'Planned'] as $v=>$l)<option value="{{ $v }}" {{ $cur===$v?'selected':'' }}>{{ $l }}</option>@endforeach</select></div></div>
          @endforeach
        </div>
        {!! $save('general') !!}
      </form>

      <div class="settings-card">
        <div class="settings-card-head">
          <div><h3>Hybrid storage — MariaDB ↔ JSON</h3><p>Live sync status, queue depth and last reconciliation (Design Doc §4).</p></div>
          {!! $conn($status['database']['up'], $status['database']['up'] ? 'MariaDB online' : 'MariaDB offline') !!}
        </div>
        <div class="sync-panel">
          <div class="sync-stat"><div class="l">Mode</div><div class="v" data-sync-field="mode">{{ $status['mode'] }}</div></div>
          <div class="sync-stat"><div class="l">Queued ops</div><div class="v" data-sync-field="queue.depth">{{ $status['queue']['depth'] }}</div></div>
          <div class="sync-stat"><div class="l">Last sync</div><div class="v" data-sync-field="queue.last_sync_at">{{ $status['queue']['last_sync_at'] ? date('H:i:s', $status['queue']['last_sync_at']) : '—' }}</div></div>
          <div class="sync-stat"><div class="l">Mirrored records</div><div class="v" data-sync-field="json.records">{{ number_format($status['json']['records']) }}</div></div>
        </div>
        <dl class="kv">
          <dt>Connection</dt><dd>{{ $status['database']['connection'] }} · node {{ $status['node'] }}</dd>
          <dt>JSON path</dt><dd>{{ $status['json']['path'] }} ({{ $status['json']['writable'] ? 'writable' : 'NOT WRITABLE' }})</dd>
          <dt>Outages</dt><dd>{{ $status['database']['outages'] }} recorded{{ $status['database']['reason'] ? ' · last: '.\Illuminate\Support\Str::limit($status['database']['reason'], 80) : '' }}</dd>
          <dt>Last result</dt><dd>{{ $status['queue']['last_sync_result'] ? json_encode(collect($status['queue']['last_sync_result'])->only(['status','applied','skipped','conflicts','failed','remaining'])) : '—' }}</dd>
        </dl>
        <div style="display:flex;gap:8px;margin-top:14px;flex-wrap:wrap;">
          <form method="post" action="{{ route('admin.system.sync') }}">@csrf<button class="btn btn-primary btn-sm">{!! Ui::icon('bolt') !!} Run sync now</button></form>
          <form method="post" action="{{ route('admin.system.mirror') }}" data-confirm="Rebuild the JSON mirror from MariaDB? This re-reads every table.">@csrf<button class="btn btn-ghost btn-sm">{!! Ui::icon('layers') !!} Rebuild JSON mirror</button></form>
          <a class="btn btn-ghost btn-sm" href="{{ route('admin.system.status') }}" target="_blank" rel="noopener">{!! Ui::icon('globe') !!} Status JSON</a>
        </div>
        @if($conflicts->count())
          <div class="section-title" style="margin-top:20px;">Conflicts awaiting review <span class="badge amber">{{ $conflicts->count() }}</span></div>
          @foreach($conflicts as $c)
            <div class="conflict">
              <div style="display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center;">
                <div><span class="cell-main">{{ $c->entity }}</span> · <span class="mono" style="font-size:11px;">{{ $c->record_id }}</span> · {{ $c->kind }} · {{ Ui::ago($c->created_at) }}</div>
                <form method="post" action="{{ route('admin.system.resolve', $c->id) }}" class="row-actions">@csrf
                  <button class="btn btn-success btn-sm" name="choice" value="local">Keep offline (JSON)</button>
                  <button class="btn btn-ghost btn-sm" name="choice" value="db">Keep MariaDB</button>
                  <button class="btn btn-danger btn-sm" name="choice" value="ignore">Dismiss</button>
                </form>
              </div>
              <div class="field-desc" style="margin-top:6px;">{{ $c->note }}</div>
              <div class="grid g-1-1" style="gap:10px;"><div><div class="field-desc">Offline / JSON version</div><pre>{{ json_encode($c->local_data, JSON_PRETTY_PRINT|JSON_UNESCAPED_SLASHES) }}</pre></div><div><div class="field-desc">MariaDB version</div><pre>{{ json_encode($c->db_data, JSON_PRETTY_PRINT|JSON_UNESCAPED_SLASHES) }}</pre></div></div>
            </div>
          @endforeach
        @endif
      </div>
    </div>

    {{-- PAYMENTS --}}
    <div class="settings-panel" data-panel="payments">
      <form method="post" action="{{ route('admin.settings.save', 'payments') }}">@csrf
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>M-PESA Daraja</h3><p>STK Push, C2B and B2C payouts for subscriptions, orders and affiliate payments.</p></div>{!! $conn($mpesaOk) !!}</div>
          {!! $row('Environment', 'Switch between sandbox testing and live transactions.', $select('payments.mpesa_env', ['Live','Sandbox'])) !!}
          {!! $row('Consumer key', 'Issued by Safaricom Daraja developer portal.', $secret('payments.mpesa_consumer_key')) !!}
          {!! $row('Consumer secret', 'Kept encrypted; never shown in full.', $secret('payments.mpesa_consumer_secret')) !!}
          {!! $row('Business shortcode', 'Paybill or till number used for STK push.', $text('payments.mpesa_shortcode')) !!}
          {!! $row('Passkey', 'Lipa na M-PESA online passkey.', $secret('payments.mpesa_passkey')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Card payments — Pesapal</h3><p>Card and international payment gateway for clients outside M-PESA coverage.</p></div>{!! $conn($pesapalOk) !!}</div>
          {!! $row('API key', 'Hosted payment page credential.', $secret('payments.pesapal_api_key')) !!}
          {!! $row('Consumer secret', 'Kept encrypted.', $secret('payments.pesapal_consumer_secret')) !!}
          {!! $row('Settlement account', 'Bank account payouts are swept to.', $secret('payments.settlement_account')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Paystack</h3><p>Card, bank and mobile-money across Africa. Webhook: <code>{{ url('/api/v1/payments/paystack/webhook') }}</code></p></div>{!! $conn($paystackOk) !!}</div>
          {!! $row('Public key', 'Used by the app/web checkout widget.', $text('payments.paystack_public_key')) !!}
          {!! $row('Secret key', 'Server key — kept encrypted. Also verifies webhooks.', $secret('payments.paystack_secret_key')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>PayPal</h3><p>International card / PayPal balance. Webhook: <code>{{ url('/api/v1/payments/paypal/webhook') }}</code></p></div>{!! $conn($paypalOk) !!}</div>
          {!! $row('Environment', 'Sandbox for testing, Live for production.', $select('payments.paypal_env', ['sandbox','live'])) !!}
          {!! $row('Client ID', 'REST app client id.', $text('payments.paypal_client_id')) !!}
          {!! $row('Secret', 'REST app secret — kept encrypted.', $secret('payments.paypal_secret')) !!}
          {!! $row('Webhook ID', 'From the PayPal dashboard; used to verify webhooks.', $text('payments.paypal_webhook_id')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Marketplace payment rules</h3><p>Escrow and tax handling for brokered jobs and orders.</p></div></div>
          {!! $row('Escrow for high-value jobs', 'Hold funds until the client confirms job completion.', $toggle('payments.escrow_enabled')) !!}
          {!! $row('VAT rate (%)', 'Applied to applicable invoices and receipts.', $text('payments.vat_rate', 'number')) !!}
          {!! $row('Payout schedule', 'How often engineer/vendor balances are paid out.', $select('payments.payout_schedule', ['Weekly','Bi-weekly','Monthly'])) !!}
        </div>
        {!! $save('payments') !!}
      </form>
    </div>

    {{-- SMS --}}
    <div class="settings-panel" data-panel="sms">
      <form method="post" action="{{ route('admin.settings.save', 'sms') }}">@csrf
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Africa's Talking — Primary</h3><p>OTP verification, transactional alerts and USSD.</p></div>{!! $conn($atOk) !!}</div>
          {!! $row('API key', 'Used to authenticate outbound SMS/USSD requests.', $secret('sms.at_api_key')) !!}
          {!! $row('Sender ID', 'Shown to recipients as the message sender.', $text('sms.at_sender_id')) !!}
          {!! $row('USSD short code', 'Feature-phone access to core directory search.', $text('sms.ussd_code')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Twilio — Secondary</h3><p>Automatic fallback provider for international coverage and redundancy.</p></div>{!! $conn($twilioOk) !!}</div>
          {!! $row('Account SID', 'Twilio account identifier.', $secret('sms.twilio_sid')) !!}
          {!! $row('Auth token', 'Kept encrypted.', $secret('sms.twilio_token')) !!}
          {!! $row('Auto-failover', "Switch to Twilio automatically if Africa's Talking delivery drops below threshold.", $toggle('sms.auto_failover')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Notification rules</h3><p>Controls inherited by the Unified Notifications Hub.</p></div></div>
          {!! $row('Require OTP at signup', 'Two-factor verification for new accounts.', $toggle('sms.otp_at_signup')) !!}
          {!! $row('Marketing SMS — default opt-in', 'New users start opted out unless they choose in.', $toggle('sms.marketing_default_optin')) !!}
          {!! $row('Digest mode for low-priority alerts', 'Batch non-urgent notifications rather than sending instantly.', $toggle('sms.digest_mode')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Mobile push — Firebase Cloud Messaging</h3><p>Android &amp; iOS push for the Flutter app. Paste the Firebase service-account JSON (kept encrypted).</p></div>{!! $conn($fcmOk) !!}</div>
          {!! $row('Service-account JSON', 'Firebase console → Project settings → Service accounts → Generate new private key.', '<textarea class="field-input editable" name="'.$fname('push.fcm_service_account').'" rows="3" placeholder="'.e($s->isConfigured('push.fcm_service_account') ? '•••••••••••• (stored)' : 'Not configured').'" style="font-family:var(--font-mono);font-size:11px;"></textarea>') !!}
          {!! $row('Minimum app version', 'Older builds are asked to update.', $text('mobile.min_app_version')) !!}
          {!! $row('Force update', 'Block older builds until they update.', $toggle('mobile.force_update')) !!}
          {!! $row('Play Store URL', 'Shown in update prompts.', $text('mobile.android_store_url', 'url')) !!}
          {!! $row('App Store URL', 'Shown in update prompts.', $text('mobile.ios_store_url', 'url')) !!}
          {!! $row('Privacy policy URL', 'Required by both app stores; returned by /api/v1/app/config.', $text('legal.privacy_url', 'url')) !!}
          {!! $row('Terms of service URL', 'Returned by /api/v1/app/config.', $text('legal.terms_url', 'url')) !!}
        </div>
        {!! $save('SMS') !!}
      </form>
    </div>

    {{-- MAPS --}}
    <div class="settings-panel" data-panel="maps">
      <form method="post" action="{{ route('admin.settings.save', 'maps') }}">@csrf
        @php $quota = max(1, (int) $s->get('maps.monthly_quota')); $used = (int) $s->get('maps.quota_used'); $pct = min(100, (int) round($used / $quota * 100)); @endphp
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Google Maps Platform</h3><p>Primary geolocation provider for search, service areas and distance sorting.</p></div>{!! $conn($mapsOk) !!}</div>
          {!! $row('API key', "Restricted to this platform's domains and mobile app bundle IDs.", $secret('maps.google_key')) !!}
          {!! $row('Monthly quota', 'Requests allowed before overflow to the fallback provider.', $text('maps.monthly_quota', 'number')) !!}
          {!! $row('Quota used this month', 'Refreshes on the 1st of each month.', '<div style="flex:1;"><div class="bar-track"><div class="bar-fill" style="width:'.$pct.'%;"></div></div><div style="font-size:11px;color:var(--text-3);margin-top:5px;">'.number_format($used).' / '.number_format($quota).' requests ('.$pct.'%)</div></div>') !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Fallback &amp; defaults</h3><p>Keeps geolocation working even if the primary quota is exceeded.</p></div></div>
          {!! $row('OpenStreetMap fallback', 'Automatically used once the Google Maps quota is exceeded.', $toggle('maps.osm_fallback')) !!}
          {!! $row('Default map center', 'Used when a user has not granted location access.', $text('maps.default_center')) !!}
          {!! $row('Geofenced job alerts', 'Notify nearby technicians when an urgent job is posted.', $toggle('maps.geofence_alerts')) !!}
        </div>
        {!! $save('maps') !!}
      </form>
    </div>

    {{-- SOCIAL --}}
    <div class="settings-panel" data-panel="social">
      <form method="post" action="{{ route('admin.settings.save', 'social') }}">@csrf
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Google Sign-In</h3><p>Faster registration and login for clients and engineers.</p></div>{!! $conn($googleOk) !!}</div>
          {!! $row('Client ID', 'OAuth 2.0 client for web and mobile.', $secret('social.google_client_id')) !!}
          {!! $row('Client secret', 'Kept encrypted.', $secret('social.google_client_secret')) !!}
          {!! $row('Enabled on', 'Where this login option is offered.', $select('social.google_enabled_on', ['Web + Mobile','Web only','Mobile only'])) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Facebook Login</h3><p>Optional secondary social login provider.</p></div>{!! $conn($fbOk) !!}</div>
          {!! $row('Client ID', 'Add credentials from the Facebook Developer console to enable.', $secret('social.facebook_client_id')) !!}
          {!! $row('Client secret', 'Kept encrypted.', $secret('social.facebook_client_secret')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Sign-in rules</h3><p>Applies to all social login providers.</p></div></div>
          {!! $row('Require email verification', 'Send a confirmation email even after social sign-in.', $toggle('social.require_email_verification')) !!}
          {!! $row('Auto-create client accounts', 'Skip manual approval for client (non-professional) sign-ups.', $toggle('social.auto_create_clients')) !!}
        </div>
        {!! $save('social login') !!}
      </form>
    </div>

    {{-- SECURITY --}}
    <div class="settings-panel" data-panel="security">
      <form method="post" action="{{ route('admin.settings.save', 'security') }}">@csrf
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Access control</h3><p>Applies to all administrator and finance accounts.</p></div></div>
          {!! $row('Enforce 2FA for admin accounts', 'Mandatory for Super Admin, Finance and Compliance roles.', $toggle('security.admin_2fa')) !!}
          {!! $row('Session timeout', 'Automatically sign out inactive admin sessions.', $select('security.session_timeout', ['15 minutes','30 minutes','1 hour'])) !!}
          {!! $row('Admin IP allowlist', 'Restrict admin console access to approved office/VPN IPs.', $toggle('security.ip_allowlist_enabled')) !!}
          {!! $row('Allowed IPs', 'Comma-separated IPv4/IPv6 addresses or CIDR ranges.', $text('security.ip_allowlist')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Monitoring &amp; audit</h3><p>Cross-cutting fraud and integrity safeguards.</p></div></div>
          {!! $row('Audit log retention', 'How long admin action history is kept.', $select('security.audit_retention', ['6 months','12 months','24 months'])) !!}
          {!! $row('Failed login lockout (attempts)', 'Lock an account after repeated failed attempts.', $text('security.failed_login_lockout', 'number')) !!}
          {!! $row('Fraud flags on payouts', 'Auto-flag unusual affiliate or vendor payout patterns for review.', $toggle('security.fraud_flags')) !!}
        </div>
        <div class="settings-card">
          <div class="settings-card-head"><div><h3>Data protection</h3><p>Kenya Data Protection Act, 2019 compliance controls.</p></div></div>
          {!! $row('Right-to-erasure requests', 'Allow users to request full account deletion from settings.', $toggle('security.erasure_requests')) !!}
          {!! $row('Data retention (inactive accounts)', 'Auto-archive accounts inactive beyond this period.', $select('security.inactive_retention', ['12 months','24 months','36 months'])) !!}
        </div>
        {!! $save('security') !!}
      </form>
    </div>
  </div>
</div>
@endsection