{% extends "layout.html" %}

{% block title %}Acessar Scanner - QRPass{% endblock %}

{% block content %}
<div class="flex justify-center items-center py-12">
    <div class="w-full max-w-md">
        <form method="POST" action="{{ url_for('public.public_scanner') }}" class="glass-card rounded-2xl shadow-2xl p-8 space-y-6">
            <h2 class="text-center text-3xl font-bold text-gray-900 dark:text-white">Acessar Scanner da Festa</h2>
            <p class="text-center text-gray-600 dark:text-gray-400 !mt-2">
                Digite o código de 6 dígitos da festa fornecido pelo organizador.
            </p>
            <div>
                <label for="party_code" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Código da Festa</label>
                <input type="text" name="party_code" id="party_code" required maxlength="6"
                       class="mt-1 block w-full px-4 py-3 text-center text-2xl tracking-[.5em] uppercase glass-effect rounded-xl focus:ring-2 focus:ring-primary focus:border-transparent transition-all duration-200 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400">
            </div>
            <div>
                <button type="submit"
                        class="w-full flex justify-center py-3 px-4 border border-transparent rounded-xl shadow-sm text-lg font-bold text-white bg-gradient-to-r from-primary to-secondary hover:shadow-lg transition-all duration-200 hover-scale">
                    Entrar no Scanner
                </button>
            </div>
            <p class="text-center text-sm">
                <a href="{{ url_for('main.landing') }}" class="text-gray-500 hover:text-primary">Voltar para a Página Inicial</a>
            </p>
        </form>
    </div>
</div>
{% endblock %}