/* Site-specific overrides on top of Pico.css (classless build).
 *
 * Keep this small. Pico already styles semantic HTML well; we only
 * add what's genuinely missing.
 */

/* Site header: tighten the default <header> padding so the nav row
 * sits close to the top of the page. */
body > header {
    padding-block: 1rem;
}

/* Site nav: lay out the brand + auth links on a single row, with the
 * auth links pushed to the right on wide screens. */
body > header nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    align-items: baseline;
    justify-content: space-between;
}

body > header nav .brand {
    font-weight: bold;
    font-size: 1.25rem;
    text-decoration: none;
}

body > header nav ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Pico styles <article role="alert"> usefully already; this just
 * gives each flash message a touch of breathing room. */
.messages article {
    margin-bottom: 0.75rem;
}

/* Inline forms (logout confirm) shouldn't take the full content width. */
form.inline-action {
    display: inline-block;
}

/* Cancelled-status badge for game nights. */
.status-cancelled {
    color: var(--pico-del-color, #b00020);
    font-weight: bold;
}

/* Site footer: muted, centered, small. */
body > footer {
    margin-top: 3rem;
    padding-block: 1.5rem;
    text-align: center;
    font-size: 0.875rem;
    color: var(--pico-muted-color);
}