@extends('layouts.app')
@section('page-title', 'Profile & Security')
@section('content')
    <div class="card" style="max-width: 720px;">
        <h3 class="card-title">Profile Information</h3>
        <form method="POST" action="/user/profile-information">
            @csrf @method('PUT')
            <div class="form-row">
                <label for="name">Name</label>
                <input id="name" type="text" name="name" value="{{ old('name', $user->name) }}" required>
            </div>
            <div class="form-row">
                <label for="email">Email</label>
                <input id="email" type="email" name="email" value="{{ old('email', $user->email) }}" required>
            </div>
            <button class="btn btn-primary" type="submit">Save</button>
        </form>
    </div>

    <div class="card" style="max-width: 720px;">
        <h3 class="card-title">Change Password</h3>
        <form method="POST" action="/user/password">
            @csrf @method('PUT')
            <div class="form-row">
                <label for="current_password">Current password</label>
                <input id="current_password" type="password" name="current_password" required autocomplete="current-password">
            </div>
            <div class="form-row">
                <label for="password">New password</label>
                <input id="password" type="password" name="password" required autocomplete="new-password">
                <div class="muted" style="margin-top:6px;">Min 12 chars, mixed case, numbers and symbols. Cannot have been seen in a data breach.</div>
            </div>
            <div class="form-row">
                <label for="password_confirmation">Confirm new password</label>
                <input id="password_confirmation" type="password" name="password_confirmation" required autocomplete="new-password">
            </div>
            <button class="btn btn-primary" type="submit">Update password</button>
        </form>
    </div>

    <div class="card" style="max-width: 720px;">
        <h3 class="card-title">Two-Factor Authentication</h3>
        @if($user->two_factor_confirmed_at)
            <div class="alert alert-success"><strong>2FA is enabled</strong> on your account.</div>
            <form method="POST" action="/user/two-factor-authentication">
                @csrf @method('DELETE')
                <button class="btn btn-danger" type="submit">Disable 2FA</button>
            </form>
        @else
            <p class="muted">Add an extra layer of security by enabling 2FA with an authenticator app (Google Authenticator, Authy, 1Password).</p>
            <form method="POST" action="/user/two-factor-authentication">
                @csrf
                <button class="btn btn-primary" type="submit">Enable 2FA</button>
            </form>
            <div class="muted" style="margin-top:12px;">After enabling, return here to scan your QR code and confirm setup.</div>
        @endif
    </div>
@endsection