@extends('games.layout')

@section('content')
<div class="wac-app">
    <div class="wac-header-bar">
        <a class="wac-back" href="/games" aria-label="Retour au terminal"><i class="fa-solid fa-chevron-left" aria-hidden="true"></i><span class="wac-back__text">Terminal</span></a>
    </div>
    <h1 class="wac-title">Photo des poignets</h1>
    <p class="wac-subtitle">Bracelets arc-en-ciel : une photo nette des poignets, une couleur = une équipe.</p>
    <div class="wac-card">
        <div id="wac-selfie-root">
            <p class="wac-selfie-hint">Une photo nette du bracelet suffit. Elle sert au jeu des équipes et n’est pas affichée publiquement sur le site.</p>
            <input type="file" id="wac-selfie-input" accept="image/jpeg,image/png,image/webp" capture="environment" class="wac-input">
            <div id="wac-selfie-actions">
                <button type="button" class="wac-btn wac-btn--primary" id="wac-selfie-submit">Envoyer la photo</button>
            </div>
            <p class="wac-selfie-status" id="wac-selfie-status"></p>
        </div>
    </div>
</div>
@endsection