<?php
/** @var string $baseUrl @var string $assetsUrl @var string $method @var string $maskedEmail */
/** @var string $csrf @var string $error @var string $notice */
$assetsUrl = $assetsUrl ?? rtrim($baseUrl, '/');
$b = rtrim($baseUrl, '/');
$h = static fn ($s) => htmlspecialchars((string) $s, ENT_QUOTES);
$isEmail = $method === 'email';
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Two-step verification · <?= $h(\PpPhp\Core\Brand::name()) ?></title>
    <?php include constant('BASE_PATH') . '/core/views/favicon.php'; ?>
    <link href="<?= $h($assetsUrl) ?>/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="<?= $h($assetsUrl) ?>/icons/bootstrap-icons.css" rel="stylesheet">
    <?php include constant('BASE_PATH') . '/core/views/theme-head.php'; ?>
    <link href="<?= $h($assetsUrl) ?>/css/account.css?v=<?= (int) @filemtime(constant('BASE_PATH') . '/public/assets/css/account.css') ?>" rel="stylesheet">
    <style>
        .tfa-code { letter-spacing: .5em; text-align: center; font-size: 1.4rem; font-weight: 700; font-variant-numeric: tabular-nums; }
        .tfa-icon { width: 54px; height: 54px; border-radius: 15px; display: grid; place-items: center; font-size: 1.5rem;
                    background: color-mix(in srgb, var(--pp-accent, #6366f1) 15%, transparent); color: var(--pp-accent, #818cf8); }
    </style>
</head>
<body class="acct-body">
    <header class="acct-top">
        <a class="acct-brand-min" href="<?= $b ?>/login" aria-label="Home"><?= \PpPhp\Core\Brand::lockup(30) ?></a>
        <div class="acct-top-actions">
            <?php include constant('BASE_PATH') . '/core/views/theme-toggle.php'; ?>
        </div>
    </header>

    <main class="acct-main">
        <div class="acct-card">
            <div class="acct-head">
                <div class="tfa-icon"><i class="bi bi-shield-lock-fill"></i></div>
                <div class="acct-head-copy">
                    <div class="acct-eyebrow">Security check</div>
                    <h1 class="acct-title">Two-step verification</h1>
                    <p class="acct-sub">
                        <?php if ($isEmail): ?>
                            Enter the 6-digit code we emailed<?= $maskedEmail ? ' to <b>' . $h($maskedEmail) . '</b>' : '' ?>.
                        <?php else: ?>
                            Open your authenticator app and enter the current 6-digit code.
                        <?php endif; ?>
                    </p>
                </div>
            </div>

            <?php if (!empty($notice)): ?>
                <div class="acct-alert is-info"><i class="bi bi-info-circle-fill"></i><span><?= $h($notice) ?></span></div>
            <?php endif; ?>
            <?php if (!empty($error)): ?>
                <div class="acct-alert is-error"><i class="bi bi-exclamation-triangle-fill"></i><span><?= $h($error) ?></span></div>
            <?php endif; ?>

            <form method="post" action="<?= $b ?>/two-factor" autocomplete="one-time-code">
                <input type="hidden" name="_token" value="<?= $h($csrf) ?>">
                <div class="acct-field">
                    <label class="acct-label" for="tfaCode">Verification code</label>
                    <input id="tfaCode" name="code" class="acct-input tfa-code" inputmode="numeric" autocomplete="one-time-code"
                           maxlength="14" placeholder="000000" autofocus required>
                    <div class="acct-hint"><i class="bi bi-key"></i> Lost your device? Enter one of your <b>backup codes</b> here instead.</div>
                </div>
                <div class="acct-actions">
                    <button type="submit" class="acct-btn acct-btn-primary"><i class="bi bi-check-lg"></i> Verify &amp; continue</button>
                    <a href="<?= $b ?>/login" class="acct-btn acct-btn-ghost"><i class="bi bi-arrow-left"></i> Back to sign in</a>
                </div>
            </form>

            <?php if ($isEmail): ?>
            <form method="post" action="<?= $b ?>/two-factor/resend" style="margin-top:.9rem">
                <input type="hidden" name="_token" value="<?= $h($csrf) ?>">
                <button type="submit" class="acct-linkbtn" style="background:none;border:0;color:var(--pp-accent,#818cf8);cursor:pointer;font-size:.86rem;padding:0">
                    <i class="bi bi-arrow-repeat"></i> Email me a new code
                </button>
            </form>
            <?php endif; ?>
        </div>
    </main>

    <footer class="acct-foot"><?= $h(\PpPhp\Core\Brand::name()) ?><?php $__tg = \PpPhp\Core\Brand::tagline(); if ($__tg !== ''): ?> · <?= $h($__tg) ?><?php endif; ?></footer>
    <script src="<?= $h($assetsUrl) ?>/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>
