{{-- v4.17.0 §A1.3 — La porte de Studio : l'identité de l'installation sur PLAQUE (§C3), e-mail,
     mot de passe, le code de double authentification quand le compte en a un, et rien d'autre. --}}
<div class="porte" data-palette style="{{ \App\Support\EspaceClient\PaletteTheme::style(\App\Support\EspaceClient\PaletteTheme::deLInstallation()) }}">
    <div class="carte">
        <div class="marque">
            @if (\App\Support\Identite::logoRecadre())
                <span class="plaque"><img src="{{ \App\Support\Identite::logoRecadre() }}" alt="{{ \App\Support\Identite::marque() }}"></span>
            @else
                <span class="wordmark">{{ \App\Support\Identite::marque() }}</span>
            @endif
            <span class="wordmark-suffixe">Studio</span>
        </div>

        <h1>Studio</h1>
        <p class="intro">Vos espaces clients, ce qui attend l'agence, et les gestes du quotidien.</p>

        @if (session('studio.refus'))
            <div class="alerte mauvais">{{ session('studio.refus') }}</div>
        @endif

        @error('email')
            <div class="alerte mauvais">{{ $message }}</div>
        @enderror

        <form wire:submit="connexion">
            <div class="champ">
                <label for="courriel">Adresse e-mail</label>
                <input id="courriel" type="email" wire:model="email" autocomplete="username" required autofocus>
            </div>

            <div class="champ">
                <label for="motdepasse">Mot de passe</label>
                <input id="motdepasse" type="password" wire:model="motDePasse" autocomplete="current-password" required>
                @error('motDePasse') <div class="alerte mauvais" style="margin-top:8px">{{ $message }}</div> @enderror
            </div>

            @if ($codeDemande)
                <div class="champ">
                    <label for="code">Code de votre application d'authentification</label>
                    <input id="code" type="text" inputmode="numeric" autocomplete="one-time-code" wire:model="code" required autofocus>
                    @error('code') <div class="alerte mauvais" style="margin-top:8px">{{ $message }}</div> @enderror
                </div>
            @endif

            <label class="coche">
                <input type="checkbox" wire:model="seSouvenir"> Rester connecté sur cet appareil
            </label>

            <button type="submit" class="btn primary wide" wire:loading.attr="disabled">
                <span wire:loading.remove wire:target="connexion">Entrer</span>
                <span wire:loading wire:target="connexion">Un instant…</span>
            </button>
        </form>

        <div class="aide">
            <a href="{{ route('filament.admin.auth.password-reset.request') }}">Mot de passe oublié</a>
        </div>

        @auth
            <form method="POST" action="{{ route('studio.deconnexion') }}" class="refus">
                @csrf
                <button type="submit" class="linkbtn">Se déconnecter</button>
            </form>
        @endauth

        <p class="pied">{{ \App\Support\Identite::marque() }} · Studio</p>
    </div>
</div>