/* Onda 5 / D-UI-01 — autenticação e estados especiais. */
body.fx-auth-special,
body.fx-page-404,
body.fx-special-state-page {
    min-height: 100vh;
    background: radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--fx-azul) 12%, transparent), transparent 30rem), linear-gradient(145deg, #f8fafc 0%, #eef2f7 100%);
}
.fx-auth-special .auth-container,
.fx-page-404 .auth-container { min-height: 100vh; height: auto; padding: clamp(1rem, 4vw, 2.5rem); background: transparent; }
.fx-auth-special .auth-box,
.fx-page-404 .auth-box,
.fx-special-state-card { border: 1px solid var(--fx-border, #dfe3e8); border-top: 4px solid var(--fx-azul); border-radius: var(--fx-radius-lg, 14px); box-shadow: 0 18px 48px rgba(15, 23, 42, .12); background: #fff; }
.fx-auth-special .auth-box { padding: clamp(1.25rem, 4vw, 2.25rem); }
.fx-auth-logo { display: block; width: min(180px, 62vw); height: auto; margin-inline: auto; }
.fx-auth-title { color: #172033; font-weight: 750; }
.fx-auth-special .form-control,
.fx-auth-special .btn { min-height: var(--fx-control-height, 42px); }
.fx-auth-special .auth-link { display: inline-flex; align-items: center; min-height: 36px; }
.fx-special-state-page { display: flex; align-items: center; justify-content: center; margin: 0; padding: 1.25rem; }
.fx-special-state-card { width: min(100%, 520px); padding: clamp(1.5rem, 5vw, 2.5rem); text-align: center; }
.fx-special-state-icon { width: 64px; height: 64px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: color-mix(in srgb, var(--fx-azul) 10%, #fff); color: var(--fx-azul); font-size: 1.8rem; }
.fx-special-state-icon.is-warning { background: #fff7df; color: #8a6100; }
.fx-special-state-actions { display: flex; justify-content: center; gap: .75rem; flex-wrap: wrap; }
.fx-special-state-code { margin-top: 1.25rem; color: #64748b; font-size: .8rem; }
@media (max-width: 767.98px) {
    .fx-auth-special .box-lg { align-self: flex-start; }
    .fx-special-state-actions { flex-direction: column; }
    .fx-special-state-actions .btn { width: 100%; }
}
