@extends('layouts.admin')
@section('title', 'Security')
@section('content')
    <x-admin.settings-tabs />
    <div class="page-head"><div><h1>Two-factor authentication.</h1><p class="muted">Use an authenticator app to add an extra layer of protection to your admin account.</p></div></div>
    @if (! auth('admin')->user()->two_factor_secret && ! $secret)
        <div class="card security-card"><h2>2FA is not enabled</h2><p class="muted">After enabling it, you’ll enter a six-digit code whenever you sign in.</p><form method="post" action="{{ route('admin.security.begin') }}">@csrf<button class="btn btn-primary">Set Up 2FA</button></form></div>
    @elseif ($secret)
        <div class="card security-card"><h2>Set up your authenticator app</h2><div class="security-setup"><div class="security-qr"><canvas data-qr-code="{{ $provisioningUri }}" aria-label="Authenticator QR code"></canvas></div><div class="security-steps"><div><strong>1. Scan the QR code</strong><p class="muted">Open your authenticator app and scan this code.</p></div><div><strong>Can’t scan it?</strong><p class="muted">Copy and enter this setup key manually.</p><div class="copy-field"><code>{{ $secret }}</code><button class="btn btn-small" type="button" data-copy="{{ $secret }}" aria-label="Copy setup key" title="Copy setup key">⧉</button></div></div><form class="form-grid" method="post" action="{{ route('admin.security.enable') }}">@csrf<div class="field full"><label for="setup-otp">2. Enter the six-digit code</label><input class="input" id="setup-otp" name="otp" inputmode="numeric" autocomplete="one-time-code" maxlength="6" pattern="[0-9]{6}" required></div><div class="field full"><button class="btn btn-primary">Enable 2FA</button></div></form></div></div></div>
    @else
        <div class="card security-card"><span class="pill active">2FA enabled</span><h2>Your admin account is protected.</h2><p class="muted">You’ll be asked for an authenticator code each time you sign in.</p><details class="admin-advanced"><summary>Disable 2FA</summary><form class="form-grid" method="post" action="{{ route('admin.security.disable') }}">@csrf<div class="field"><label>Password</label><div class="password-input"><input class="input" id="disable-2fa-password" type="password" name="password" autocomplete="current-password" required><button type="button" data-password-toggle aria-controls="disable-2fa-password" aria-label="Show password" aria-pressed="false">Show</button></div></div><div class="field"><label>Authenticator code</label><input class="input" name="otp" inputmode="numeric" autocomplete="one-time-code" maxlength="6" required></div><div class="field full"><button class="btn btn-danger">Disable 2FA</button></div></form></details></div>
    @endif
@endsection