use maud::{Markup, html};

pub fn admin_pin_guard(error: Option<&str>) -> Markup {
    html! {
        div class="max-w-md mx-auto my-12 p-6 bg-[#fbf8f2] border-2 border-[#c6b297] rounded-2xl shadow-lg text-center" {
            div class="text-3xl mb-2" { "🔒" }
            h2 class="text-2xl font-bold text-stone-800 mb-1" { "Admin Access" }
            p class="text-sm text-stone-600 mb-6 italic" {
                "Enter the 6-digit Admin PIN to access database diagnostics and tournament controls."
            }

            @if let Some(err) = error {
                div class="mb-4 p-3 bg-red-100 border border-red-300 text-red-700 text-xs rounded-lg font-semibold" {
                    (err)
                }
            }

            form
                hx-post="/pin"
                hx-target="#main-content"
                class="flex flex-col items-center gap-4" {

                div class="flex justify-center" {
                    input
                        type="password"
                        name="pin"
                        maxlength="6"
                        minlength="6"
                        pattern="[0-9]{6}"
                        inputmode="numeric"
                        autocomplete="current-password"
                        placeholder="••••••"
                        required
                        autofocus
                        class="text-center font-mono text-2xl tracking-[0.4em] py-2 px-4 w-52 rounded-lg border-2 border-[#c6b297] bg-white text-stone-800 focus:outline-none focus:border-[#5b7c60]";
                }

                button
                    type="submit"
                    class="cottage-btn cottage-btn-primary w-full mt-2" {
                    "Unlock Admin Area"
                }
            }
        }
    }
}