/*
 * The standalone auth screens: the login form, its confirmation page and access-denied.
 *
 * None wraps in <x-layout>, because that component renders the full navigation menu and these are
 * the pages shown to people who either have no session yet or have just been told they cannot
 * open what they asked for.
 *
 * Pico supplies the card itself — <article> is its card component, with banded header and footer.
 * All this file does is size and centre it; everything else comes from the framework.
 */

body > main.container {
    max-width: 26rem;
}

body > main.container > article {
    margin-top: 3rem;
}

/* app.css defaults form controls to their natural width, because nearly every form in this app is
 * an inline filter row. The auth card is the opposite case — a stacked form, one field per line —
 * so it opts back in to Pico's full-width controls. */
body > main.container > article input,
body > main.container > article button[type="submit"] {
    width: 100%;
}