<!DOCTYPE html>
<html lang="<?= esc(service('request')->getLocale()) ?>">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?= esc(lang('Backoffice.registerTitle')) ?></title>
    <link rel="icon" type="image/png" href="<?= base_url('assets/icon.png') ?>">
    <link rel="shortcut icon" type="image/png" href="<?= base_url('assets/icon.png') ?>">
    <link rel="apple-touch-icon" href="<?= base_url('assets/icon.png') ?>">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;700&family=IBM+Plex+Sans:wght@400;500;600;700&family=Sora:wght@400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="<?= base_url('assets/quantum-backoffice.css') ?>">
</head>
<body class="qb-auth-body">
    <div class="pointer-events-none fixed inset-0 overflow-hidden">
        <div class="qb-orb qb-orb--one"></div>
        <div class="qb-orb qb-orb--two"></div>
        <div class="qb-orb qb-orb--three"></div>
    </div>

    <div class="qb-auth-shell">
        <div class="qb-auth-layout">
            <section class="qb-auth-showcase">
                <div class="qb-auth-brand">
                    <img src="<?= base_url('assets/quantum-wordmark.svg') ?>" alt="Quantum">
                    <span>Rastreabilidade tecnica confidencial</span>
                </div>

                <div class="eyebrow"><?= esc(lang('Backoffice.registerHeading')) ?></div>
                <h1 class="qb-auth-title">Criar workspace Quantum</h1>
                <p class="qb-auth-lead"><?= esc(lang('Backoffice.registerIntro')) ?></p>

                <div class="qb-auth-stats">
                    <div class="qb-auth-stat">
                        <strong>1 owner</strong>
                        <span>Primeiro utilizador com controlo inicial do workspace.</span>
                    </div>
                    <div class="qb-auth-stat">
                        <strong>1 tenant</strong>
                        <span>Empresa isolada com contexto multi-tenant imediato.</span>
                    </div>
                    <div class="qb-auth-stat">
                        <strong>100%</strong>
                        <span>Onboarding web sem passos técnicos extra.</span>
                    </div>
                </div>

                <div class="qb-auth-canvas" aria-hidden="true">
                    <div class="qb-auth-float qb-auth-float--one">
                        <strong>Workspace</strong>
                        <span>Empresa, equipa e ativos ligados ao mesmo tenant.</span>
                    </div>
                    <div class="qb-auth-float qb-auth-float--two">
                        <strong>Governance</strong>
                        <span>Owner inicial preparado para gerir membros e operações.</span>
                    </div>
                    <div class="qb-auth-float qb-auth-float--three">
                        <strong>Escalavel</strong>
                        <span>Preparado para manutenções, auditoria, analytics e verificação pública.</span>
                    </div>
                </div>
            </section>

            <section class="qb-auth-panel">
                <div class="qb-auth-panel-top">
                    <div class="qb-auth-panel-copy">Preenche os dados base da conta e da empresa para arrancar com um tenant proprio.</div>
                    <a class="qb-auth-link" href="<?= site_url('login') ?>"><?= esc(lang('Backoffice.alreadyHaveAccount')) ?></a>
                </div>

                <?php if (session()->getFlashdata('error')): ?>
                    <div class="qb-alert qb-alert--error mb-4"><?= esc(session()->getFlashdata('error')) ?></div>
                <?php endif; ?>

                <?php if (session('errors')): ?>
                    <ul class="qb-alert qb-alert--error mb-4">
                        <?php foreach (session('errors') as $error): ?>
                            <li><?= esc($error) ?></li>
                        <?php endforeach; ?>
                    </ul>
                <?php endif; ?>

                <form method="post" action="<?= site_url('register') ?>" class="grid gap-4">
                    <?= csrf_field() ?>
                    <div class="qb-auth-grid">
                        <div class="qb-auth-field">
                            <label for="name"><?= esc(lang('Backoffice.ownerName')) ?></label>
                            <input id="name" name="name" value="<?= esc(old('name')) ?>" autocomplete="name">
                        </div>
                        <div class="qb-auth-field">
                            <label for="email"><?= esc(lang('Backoffice.email')) ?></label>
                            <input id="email" type="email" name="email" value="<?= esc(old('email')) ?>" autocomplete="email">
                        </div>
                        <div class="qb-auth-field">
                            <label for="password"><?= esc(lang('Backoffice.password')) ?></label>
                            <input id="password" type="password" name="password" autocomplete="new-password">
                        </div>
                        <div class="qb-auth-field">
                            <label for="password_confirm"><?= esc(lang('Backoffice.passwordConfirm')) ?></label>
                            <input id="password_confirm" type="password" name="password_confirm" autocomplete="new-password">
                        </div>
                        <div class="qb-auth-field">
                            <label for="organization_name"><?= esc(lang('Backoffice.companyName')) ?></label>
                            <input id="organization_name" name="organization_name" value="<?= esc(old('organization_name')) ?>">
                        </div>
                        <div class="qb-auth-field">
                            <label for="organization_slug"><?= esc(lang('Backoffice.companySlug')) ?></label>
                            <input id="organization_slug" name="organization_slug" value="<?= esc(old('organization_slug')) ?>">
                        </div>
                        <div class="qb-auth-field">
                            <label for="organization_type"><?= esc(lang('Backoffice.companyType')) ?></label>
                            <select id="organization_type" name="organization_type">
                                <?php foreach (['issuer', 'client', 'partner', 'auditor'] as $type): ?>
                                    <option value="<?= $type ?>" <?= old('organization_type', 'client') === $type ? 'selected' : '' ?>><?= ucfirst($type) ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        <div class="qb-auth-field">
                            <label for="country_code"><?= esc(lang('Backoffice.country')) ?></label>
                            <input id="country_code" name="country_code" maxlength="2" value="<?= esc(old('country_code')) ?>" placeholder="PT">
                        </div>
                        <div class="qb-auth-field qb-auth-field--full">
                            <label for="website"><?= esc(lang('Backoffice.website')) ?></label>
                            <input id="website" name="website" value="<?= esc(old('website')) ?>" placeholder="https://company.com">
                        </div>
                    </div>
                    <div class="qb-auth-actions">
                        <button type="submit"><?= esc(lang('Backoffice.createCompany')) ?></button>
                        <a class="link-btn" href="<?= site_url('login') ?>"><?= esc(lang('Backoffice.alreadyHaveAccount')) ?></a>
                    </div>
                </form>
            </section>
        </div>
    </div>
</body>
</html>
