/* ══════════════════════════════════════════════════════════════════════════
   Aanmeldschermen (login e.d.): één gecentreerde kaart, geen navbar/help-paneel
   eromheen - dat hoort bij de applicatie zelf, niet bij het inloggen erop.
   Gebruikt door AuthLayout in elk FerroxX Flow-product.
   ══════════════════════════════════════════════════════════════════════════ */

.fx-auth {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem 1rem;
    background: var(--fx-bg);
}

.fx-auth-card {
    width: 100%;
    max-width: 28rem;
    background: var(--fx-surface);
    border: 1px solid var(--fx-border);
    border-radius: .75rem;
    padding: 2rem;
}

/* Voor een aanmeldscherm met meer inhoud dan de smalle kaart aankan (bijv. een registratiepagina
   met twee kolommen naast elkaar) - zie FerroxXFlow.Portal's registratiepagina. */
.fx-auth-card--wide {
    max-width: 46rem;
}

.fx-auth-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    margin-bottom: 1.5rem;
}

.fx-auth-brand img { height: 40px; width: auto; }
.fx-auth-tag { color: var(--fx-text-muted); font-size: .8rem; }
.fx-auth-footer { color: var(--fx-text-faint); font-size: .8rem; margin: 0; }