@extends('layouts.app')
@section('title','Double authentification')
@section('content')
<div style="max-width:460px;margin:48px auto;padding:0 20px">
  <div class="card">
    <div class="h1">Double authentification</div>

    @if(session('error'))<div class="flash err">{{ session('error') }}</div>@endif
    @error('code')<div class="flash err">{{ $message }}</div>@enderror
    @error('password')<div class="flash err">{{ $message }}</div>@enderror

    @if($enabled)
      <p class="sub"><i data-lucide="shield-check" style="vertical-align:-3px"></i> La double authentification est <b>active</b> sur votre compte.</p>
      @if($mandatory)
        <p class="sub">Elle est obligatoire pour votre rôle et ne peut pas être désactivée.</p>
      @else
        <form method="post" action="{{ route('2fa.disable') }}" onsubmit="return confirm('Désactiver la double authentification ?')">
          @csrf @method('DELETE')
          <label>Confirmez votre mot de passe pour désactiver</label>
          <input type="password" name="password" required>
          <button class="btn danger" style="width:100%;margin-top:14px;justify-content:center">Désactiver la 2FA</button>
        </form>
      @endif
      <p style="margin-top:14px"><a href="{{ route('admin.dashboard') }}">← Retour au tableau de bord</a></p>
    @else
      <p class="sub">
        @if($mandatory)Obligatoire pour votre rôle. @endif
        Scannez le QR code avec une application d'authentification (Google Authenticator, Authy, FreeOTP…), puis saisissez le code à 6 chiffres.
      </p>
      <div style="text-align:center;margin:18px 0">
        <img src="{{ $qrDataUri }}" alt="QR code de configuration 2FA" width="220" height="220" style="background:#fff;padding:10px;border-radius:10px">
      </div>
      <label>Clé de configuration manuelle</label>
      <input type="text" value="{{ $secret }}" readonly onclick="this.select()" style="font-family:monospace;letter-spacing:2px;text-align:center">
      <form method="post" action="{{ route('2fa.enable') }}" style="margin-top:8px">
        @csrf
        <label>Code de vérification</label>
        <input type="text" name="code" inputmode="numeric" autocomplete="one-time-code" placeholder="123456" required autofocus style="text-align:center;letter-spacing:6px;font-size:1.2rem">
        <button class="btn" style="width:100%;margin-top:14px;justify-content:center">Activer</button>
      </form>
      <form method="post" action="{{ route('logout') }}" style="margin-top:10px">@csrf<button class="btn ghost sm" style="width:100%;justify-content:center">Se déconnecter</button></form>
    @endif
  </div>
</div>
@endsection