<?php
$this->layout('minimal', [
    'title' => 'Set Up',
    'page_class' => 'login-content'
]);

/** @var \App\Assets $assets */
$assets->load('zxcvbn');
?>

<div class="public-page">
    <div class="card">
        <div class="card-body">
            <div class="row mb-4">
                <div class="col-sm">
                    <h2 class="card-title mb-0 text-center">
                        <?=sprintf(__('AzuraCast First-Time Setup')) ?>
                    </h2>
                    <h3 class="text-center">
                        <small class="text-muted"><?=__('Welcome to AzuraCast!') ?></small>
                    </h3>
                </div>
            </div>

            <div class="row mb-3">
                <div class="col-sm">
                    <p><?=__('Let\'s get started by creating your Super Administrator account.') ?></p>
                    <p><?=__('This account will have full access to the system, and you\'ll automatically be logged in to it for the rest of setup.') ?></p>
                </div>
            </div>

            <form id="login-form" action="" method="post">
                <div class="row">
                    <div class="form-group col-sm">
                        <label for="username" class="mb-2">
                            <i class="material-icons mr-1" aria-hidden="true">email</i>
                            <strong><?=__('E-mail Address') ?></strong>
                        </label>
                        <input type="email" id="username" name="username" class="form-control" placeholder="" required>
                    </div>
                </div>

                <div class="row">
                    <div class="form-group col-sm">
                        <label for="password" class="mb-2">
                            <i class="material-icons mr-1" aria-hidden="true">vpn_key</i>
                            <strong><?=__('Password') ?></strong>
                        </label>
                        <input type="password" id="password" name="password" class="strength form-control" placeholder="" required>
                    </div>
                </div>

                <div class="row">
                    <div class="col-sm">
                        <button type="submit" role="button" title="<?=__('Create Account') ?>" class="btn btn-login btn-primary btn-block mt-2">
                            <?=__('Create Account') ?>
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
