<?php
$assetsUrl = isset($assetsUrl) ? rtrim((string)$assetsUrl, '/') : rtrim((string)$baseUrl, '/');
$baseUrl = rtrim((string)$baseUrl, '/');
$loginAssetVersion = (string)max(
    (int)@filemtime(constant('BASE_PATH') . '/public/assets/auth/login.css'),
    (int)@filemtime(constant('BASE_PATH') . '/public/assets/auth/login-polish.css'),
    (int)@filemtime(constant('BASE_PATH') . '/public/assets/auth/login.js')
);
$requestOld = is_array($requestOld ?? null) ? $requestOld : [];
$value = static fn(string $key, string $fallback = ''): string => htmlspecialchars((string)($requestOld[$key] ?? $fallback), ENT_QUOTES, 'UTF-8');
$openRequest = !empty($requestError);
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="color-scheme" content="light">
    <meta name="theme-color" content="#111a3b">
    <title>Sign in · <?= htmlspecialchars(\PpPhp\Core\Brand::name()) ?></title>
    <?php include constant('BASE_PATH') . '/core/views/favicon.php'; ?>
    <link href="<?= $assetsUrl ?>/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="<?= $assetsUrl ?>/icons/bootstrap-icons.css" rel="stylesheet">
    <link href="<?= $assetsUrl ?>/auth/login.css?v=<?= urlencode($loginAssetVersion) ?>" rel="stylesheet">
    <link href="<?= $assetsUrl ?>/auth/login-polish.css?v=<?= urlencode($loginAssetVersion) ?>" rel="stylesheet">
</head>
<body data-open-request="<?= $openRequest ? '1' : '0' ?>">
    <a class="skip-link" href="#signInForm">Skip to sign in</a>

    <main class="login-shell">
        <section class="login-story" aria-labelledby="storyTitle">
            <div class="story-glow story-glow-one"></div>
            <div class="story-glow story-glow-two"></div>

            <header class="brand-lockup">
                <?= \PpPhp\Core\Brand::lockup(54, 'auth-brand-logo') ?>
                <small>Rapid application studio</small>
            </header>

            <div class="story-content">
                <span class="eyebrow"><i class="bi bi-stars"></i> Build with momentum</span>
                <h1 id="storyTitle">From database to a polished application—<em>beautifully fast.</em></h1>
                <p>Model data, compose responsive pages, add business logic, and generate production-minded PHP without losing control of the code.</p>

                <div class="workflow-line" aria-label="Application workflow">
                    <span><b>01</b> Connect</span><i class="bi bi-arrow-right"></i>
                    <span><b>02</b> Design</span><i class="bi bi-arrow-right"></i>
                    <span><b>03</b> Build</span>
                </div>

                <div class="capability-grid">
                    <article><i class="bi bi-diagram-3"></i><div><strong>Visual data model</strong><span>Tables, views, fields, and relationships in one workspace.</span></div></article>
                    <article><i class="bi bi-window-stack"></i><div><strong>Responsive designer</strong><span>Shape pages and reusable experiences visually.</span></div></article>
                    <article><i class="bi bi-braces-asterisk"></i><div><strong>Developer control</strong><span>Events, queries, security, and custom code stay accessible.</span></div></article>
                    <article><i class="bi bi-rocket-takeoff"></i><div><strong>One-click builds</strong><span>Generate a complete PHP application when you are ready.</span></div></article>
                </div>
            </div>

            <footer class="story-footer">
                <span><i class="bi bi-shield-check"></i> Secure by design</span>
                <span><i class="bi bi-database-check"></i> Multi-database ready</span>
                <span><i class="bi bi-phone"></i> Responsive output</span>
            </footer>
        </section>

        <section class="login-access" aria-labelledby="loginTitle">
            <div class="mobile-brand">
                <?= \PpPhp\Core\Brand::lockup(34) ?>
            </div>

            <div class="access-card">
                <div class="access-heading">
                    <span class="welcome-icon"><i class="bi bi-person-check"></i></span>
                    <div>
                        <span class="section-label">Welcome back</span>
                        <h2 id="loginTitle">Continue building</h2>
                        <p>Sign in to open your projects and workspace.</p>
                    </div>
                </div>

                <div class="session-assurance" aria-label="Sign-in security status">
                    <span><i class="bi bi-circle-fill"></i> System ready</span>
                    <span><i class="bi bi-shield-check"></i> Protected session</span>
                </div>

                <?php if (!empty($error)): ?>
                    <div class="status-message status-error" role="alert">
                        <i class="bi bi-exclamation-circle"></i>
                        <span><?= htmlspecialchars((string)$error, ENT_QUOTES, 'UTF-8') ?></span>
                    </div>
                <?php endif; ?>

                <form method="post" action="<?= $baseUrl ?>/login" id="signInForm">
                    <?= \PpPhp\Core\Security::CSRF()->HiddenField() ?>
                    <div class="field-group">
                        <label for="loginIdentity">Username or email</label>
                        <div class="input-shell">
                            <i class="bi bi-person"></i>
                            <input id="loginIdentity" type="text" name="username" autocomplete="username" placeholder="you@example.com" required autofocus>
                        </div>
                    </div>

                    <div class="field-group">
                        <div class="label-row"><label for="loginPassword">Password</label><a href="<?= $baseUrl ?>/forgot-password" style="font-size:12px;font-weight:600;text-decoration:none;">Forgot password?</a></div>
                        <div class="input-shell">
                            <i class="bi bi-lock"></i>
                            <input id="loginPassword" type="password" name="password" autocomplete="current-password" placeholder="Enter your password" aria-describedby="capsLockNotice" required>
                            <button type="button" class="password-toggle" id="passwordToggle" aria-label="Show password" aria-pressed="false"><i class="bi bi-eye"></i></button>
                        </div>
                        <div class="caps-lock-notice" id="capsLockNotice" hidden><i class="bi bi-capslock"></i> Caps Lock is on</div>
                    </div>

                    <button type="submit" class="sign-in-button">
                        <span>Sign in securely</span><i class="bi bi-arrow-right"></i>
                    </button>
                </form>

                <div class="account-note"><i class="bi bi-info-circle"></i><span>Use the account created during installation or provided by your administrator.</span></div>

                <div class="access-divider"><span>New to <?= htmlspecialchars(\PpPhp\Core\Brand::name()) ?>?</span></div>

                <?php if (!empty($requestSuccess)): ?>
                    <div class="status-message status-success" role="status">
                        <i class="bi bi-check-circle"></i>
                        <span><?= htmlspecialchars((string)$requestSuccess, ENT_QUOTES, 'UTF-8') ?></span>
                    </div>
                <?php endif; ?>

                <button type="button" class="try-button" data-bs-toggle="modal" data-bs-target="#temporaryAccessModal">
                    <span class="try-icon"><i class="bi bi-lightning-charge"></i></span>
                    <span><strong>Want to try?</strong><small>Request a temporary, administrator-reviewed login.</small></span>
                    <i class="bi bi-chevron-right"></i>
                </button>

                <p class="privacy-note"><i class="bi bi-shield-lock"></i> Credentials are never shared automatically. Every request is reviewed by an administrator.</p>
            </div>

            <footer class="access-footer"><?= htmlspecialchars(\PpPhp\Core\Brand::name()) ?> · Build clearly. Ship confidently.</footer>
        </section>
    </main>

    <div class="modal fade temporary-access-modal" id="temporaryAccessModal" tabindex="-1" aria-labelledby="temporaryAccessTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="request-title-wrap">
                        <span><i class="bi bi-lightning-charge"></i></span>
                        <div><small>Temporary access</small><h2 class="modal-title" id="temporaryAccessTitle">Tell us what you want to build</h2></div>
                    </div>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form method="post" action="<?= $baseUrl ?>/temporary-access/request" id="temporaryAccessForm">
                    <?= \PpPhp\Core\Security::CSRF()->HiddenField() ?>
                    <div class="modal-body">
                        <p class="request-intro">Share a few details. An administrator will review your request and contact you—usually within one business day.</p>

                        <?php if (!empty($requestError)): ?>
                            <div class="status-message status-error" role="alert">
                                <i class="bi bi-exclamation-circle"></i>
                                <span><?= htmlspecialchars((string)$requestError, ENT_QUOTES, 'UTF-8') ?></span>
                            </div>
                        <?php endif; ?>

                        <div class="request-grid">
                            <div class="field-group">
                                <label for="requestName">Full name <b>*</b></label>
                                <input class="form-control" id="requestName" name="full_name" value="<?= $value('full_name') ?>" maxlength="140" autocomplete="name" required>
                            </div>
                            <div class="field-group">
                                <label for="requestEmail">Email <b>*</b></label>
                                <input class="form-control" id="requestEmail" type="email" name="email" value="<?= $value('email') ?>" maxlength="190" autocomplete="email" required placeholder="you@example.com" aria-describedby="requestEmailHint">
                                <small id="requestEmailHint" style="display:block;margin-top:4px;font-size:11.5px;opacity:.7;">Please avoid a work address — company filters often block our reply.</small>
                            </div>
                            <div class="field-group">
                                <label for="requestOrganization">Organization</label>
                                <input class="form-control" id="requestOrganization" name="organization" value="<?= $value('organization') ?>" maxlength="180" autocomplete="organization">
                            </div>
                            <div class="field-group">
                                <label for="requestRole">Your role</label>
                                <input class="form-control" id="requestRole" name="role_title" value="<?= $value('role_title') ?>" maxlength="140" autocomplete="organization-title" placeholder="e.g., Full-stack developer">
                            </div>
                            <div class="field-group request-duration">
                                <label for="requestDuration">Requested access</label>
                                <select class="form-select" id="requestDuration" name="requested_duration_hours">
                                    <?php foreach ([24 => '24 hours', 72 => '3 days', 168 => '7 days'] as $hours => $label): ?>
                                        <option value="<?= $hours ?>" <?= (int)($requestOld['requested_duration_hours'] ?? 24) === $hours ? 'selected' : '' ?>><?= $label ?></option>
                                    <?php endforeach; ?>
                                </select>
                            </div>
                            <div class="field-group request-purpose">
                                <div class="label-row"><label for="requestUseCase">What do you want to build? <b>*</b></label><span id="useCaseCount">0 / 1500</span></div>
                                <textarea class="form-control" id="requestUseCase" name="use_case" rows="3" minlength="12" maxlength="1500" required placeholder="A short description helps us review your request."><?= $value('use_case') ?></textarea>
                            </div>
                        </div>

                        <div class="honeypot" aria-hidden="true">
                            <label for="requestWebsite">Website</label><input id="requestWebsite" name="website" tabindex="-1" autocomplete="off">
                        </div>

                        <label class="consent-check">
                            <input type="checkbox" name="consent" value="1" required>
                            <span>I agree that <?= htmlspecialchars(\PpPhp\Core\Brand::name()) ?> may contact me about this temporary-access request.</span>
                        </label>
                    </div>
                    <div class="modal-footer">
                        <span class="request-safety"><i class="bi bi-shield-check"></i> Review required</span>
                        <div><button type="button" class="btn btn-light" data-bs-dismiss="modal">Not now</button><button type="submit" class="btn request-submit"><span>Send request</span><i class="bi bi-send"></i></button></div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script src="<?= $assetsUrl ?>/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="<?= $assetsUrl ?>/auth/login.js?v=<?= urlencode($loginAssetVersion) ?>"></script>
    <script>
    // Deep link from the marketing site: /login?try=1 (or #try) opens the
    // trial-request form straight away, so a visitor who clicked "Request a
    // trial" on ppradhan.com lands on the form rather than on a sign-in box
    // they cannot use.
    (function () {
        var wants = /[?&]try=1\b/.test(location.search) || location.hash === '#try';
        if (!wants) return;
        var el = document.getElementById('temporaryAccessModal');
        if (!el || !window.bootstrap) return;
        bootstrap.Modal.getOrCreateInstance(el).show();
        var first = el.querySelector('input,textarea,select');
        if (first) el.addEventListener('shown.bs.modal', function () { first.focus(); }, { once: true });
    })();
    </script>
</body>
</html>
