<?php
/**
 * @license GPL-2.0-or-later
 */
defined( 'ABSPATH' ) || exit;
?>
<div class="volade-wrap volade-auth-page">
    <div class="volade-auth-shell">
        <div class="volade-auth-brand">
            <div class="volade-auth-logo">V</div>
            <h2><?php esc_html_e( 'Bienvenue sur Volade', 'php-compatibility-checker-by-volade' ); ?></h2>
            <p><?php esc_html_e( 'Un compte pour tous vos plugins — XP, badges, missions et premium.', 'php-compatibility-checker-by-volade' ); ?></p>
        </div>

        <div class="volade-auth-card">
            <div class="volade-auth-tabs">
                <button type="button" class="volade-tab active" data-tab="login"><?php esc_html_e( 'Connexion', 'php-compatibility-checker-by-volade' ); ?></button>
                <button type="button" class="volade-tab" data-tab="register"><?php esc_html_e( 'Inscription', 'php-compatibility-checker-by-volade' ); ?></button>
            </div>

            <form id="volade-login-form" class="volade-auth-form active" novalidate>
                <div class="volade-field">
                    <label for="volade-login"><?php esc_html_e( 'Pseudo ou e-mail', 'php-compatibility-checker-by-volade' ); ?></label>
                    <input type="text" id="volade-login" name="login" required autocomplete="username" />
                </div>
                <div class="volade-field">
                    <label for="volade-login-password"><?php esc_html_e( 'Mot de passe', 'php-compatibility-checker-by-volade' ); ?></label>
                    <input type="password" id="volade-login-password" name="password" required autocomplete="current-password" />
                </div>
                <p class="volade-msg" role="status" aria-live="polite"></p>
                <button type="submit" class="volade-btn volade-btn-primary volade-auth-submit">
                    <?php esc_html_e( 'Se connecter', 'php-compatibility-checker-by-volade' ); ?>
                </button>
            </form>

            <form id="volade-register-form" class="volade-auth-form" novalidate>
                <div class="volade-field">
                    <label for="volade-pseudo"><?php esc_html_e( 'Pseudo', 'php-compatibility-checker-by-volade' ); ?></label>
                    <input type="text" id="volade-pseudo" name="pseudo" required minlength="3" maxlength="50" autocomplete="username" />
                </div>
                <div class="volade-field">
                    <label for="volade-email"><?php esc_html_e( 'E-mail', 'php-compatibility-checker-by-volade' ); ?></label>
                    <input type="email" id="volade-email" name="email" required autocomplete="email" />
                </div>
                <div class="volade-field">
                    <label for="volade-register-password"><?php esc_html_e( 'Mot de passe', 'php-compatibility-checker-by-volade' ); ?></label>
                    <input type="password" id="volade-register-password" name="password" required minlength="8" autocomplete="new-password" />
                    <small class="description"><?php esc_html_e( '8 caractères minimum.', 'php-compatibility-checker-by-volade' ); ?></small>
                </div>
                <p class="volade-msg" role="status" aria-live="polite"></p>
                <button type="submit" class="volade-btn volade-btn-primary volade-auth-submit">
                    <?php esc_html_e( 'Créer mon compte', 'php-compatibility-checker-by-volade' ); ?>
                </button>
            </form>
        </div>
    </div>
</div>
