@extends('layouts.admin')
@section('content')
<div class="settings-layout" style="grid-template-columns:1fr 1fr;">
  <div>
    <div class="settings-card">
      <div class="settings-card-head"><div><h3>Two-factor authentication</h3><p>Time-based codes (Google Authenticator, Authy, 1Password). Mandatory for admin accounts.</p></div><span class="conn-status {{ $user->hasTwoFactor() ? 'on' : 'off' }}"><span class="conn-dot"></span>{{ $user->hasTwoFactor() ? 'Enabled' : 'Not enabled' }}</span></div>
      @if(!$user->hasTwoFactor())
        <p class="field-desc" style="margin:0 0 10px;">1. Scan the QR code (or enter the secret manually) in your authenticator app.<br>2. Enter the 6-digit code it shows to activate.</p>
        <div style="display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start;margin-bottom:12px;">
          <div class="qr" id="qr"></div>
          <div style="flex:1;min-width:220px;"><div class="field-label">Secret</div><div class="code-box">{{ chunk_split($pendingSecret, 4, ' ') }}</div><div class="field-desc" style="margin-top:6px;word-break:break-all;">{{ $otpauth }}</div></div>
        </div>
        <form method="post" action="{{ route('admin.account.2fa.enable') }}" class="filter-bar">@csrf<input type="text" name="code" inputmode="numeric" pattern="[0-9]{6}" placeholder="123456" required style="width:120px;"><button class="btn btn-primary btn-sm">Activate 2FA</button></form>
      @else
        <form method="post" action="{{ route('admin.account.2fa.disable') }}" class="filter-bar" data-confirm="Disable two-factor authentication?">@csrf<input type="password" name="password" placeholder="Confirm password" required><button class="btn btn-danger btn-sm">Disable 2FA</button></form>
      @endif
    </div>
    <div class="settings-card">
      <div class="settings-card-head"><div><h3>Change password</h3><p>Minimum 12 characters.</p></div></div>
      <form method="post" action="{{ route('admin.account.password') }}">@csrf
        <div class="form-grid"><div class="f full"><label>Current password</label><input type="password" name="current_password" required></div><div class="f"><label>New password</label><input type="password" name="password" required minlength="12"></div><div class="f"><label>Confirm new password</label><input type="password" name="password_confirmation" required></div></div>
        <button class="btn btn-primary btn-sm">Update password</button>
      </form>
    </div>
  </div>
  <div class="settings-card">
    <div class="settings-card-head"><div><h3>Recent activity</h3><p>Your last 10 audited actions.</p></div></div>
    <dl class="kv">@forelse($recent as $a)<dt>{{ \App\Support\Ui::ago($a->created_at) }}</dt><dd>{{ $a->action }} <span style="color:var(--text-3)">{{ $a->ip }}</span></dd>@empty<dt>—</dt><dd>No activity yet.</dd>@endforelse</dl>
  </div>
</div>
@endsection
@if(!$user->hasTwoFactor())
@push('scripts')
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
<script>try{ new QRCode(document.getElementById('qr'), {text: @json($otpauth), width: 160, height: 160}); }catch(e){}</script>
@endpush
@endif