/* Telas avulsas (login, instalação, 404, 500): complementos de base.css. Só tokens de cor. */

.au-page { min-height: 100vh; }
.au-theme { position: fixed; z-index: 5; top: 16px; right: 16px; width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); display: grid; place-content: center; cursor: pointer; box-shadow: var(--shadow-xs); transition: background .15s, transform .1s; }
.au-theme:hover { background: var(--surface-2); color: var(--text); }
.au-theme:active { transform: scale(.94); }
.au-theme i { font-size: 18px; }
.au-theme .au-i-dark { display: none; }
:root[data-theme="dark"] .au-theme .au-i-dark { display: block; }
:root[data-theme="dark"] .au-theme .au-i-light { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .au-theme .au-i-dark { display: block; }
  :root:not([data-theme="light"]) .au-theme .au-i-light { display: none; }
}

/* Lado da marca (login) */
.au-side-main { margin: auto 0; padding: 40px 0; }
.au-side-kicker { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 18px; padding: 5px 12px 5px 6px; border-radius: 999px; background: rgba(51, 213, 213, .12); color: var(--brand-cyan); font-size: 12.5px; font-weight: 600; }
.au-side-kicker i { width: 22px; height: 22px; border-radius: 50%; display: inline-grid; place-content: center; background: rgba(51, 213, 213, .2); font-size: 13px; }
.au-side li b { display: block; color: #f3f7e6; font-weight: 620; }
.au-side li span { display: block; font-size: 12.5px; color: rgba(243, 247, 230, .55); }
.au-side li { align-items: flex-start; }
.au-side li i { flex: none; margin-top: 2px; }
.au-side-foot { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* Lado do formulário */
.au-page.split .au-content { background: var(--bg); }
.au-card { width: 100%; padding: 34px 32px 30px; border-radius: var(--r-2xl); background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow); }
.au-card .au-brand { margin-bottom: 24px; }
.au-mobile-brand { display: none; }
.au-hint { display: flex; align-items: center; gap: 8px; margin-top: 18px; font-size: 12.5px; color: var(--muted); }
.au-hint i { font-size: 16px; color: var(--accent-ink); }
.au-form .au-alert { margin: 0; }
.au-stack { display: flex; flex-direction: column; gap: 16px; }
.au-code-help { font-size: 12.5px; color: var(--muted); text-align: center; }
.au-steps-bar { display: flex; gap: 8px; margin-bottom: 22px; }
.au-steps-bar span { flex: 1; display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: var(--r-md); background: var(--surface-2); color: var(--muted); font-size: 12.5px; font-weight: 600; }
.au-steps-bar span b { width: 22px; height: 22px; border-radius: 50%; display: inline-grid; place-content: center; background: var(--surface); border: 1px solid var(--border); font-size: 11.5px; }
.au-steps-bar span.on { background: var(--accent-soft); color: var(--text); }
.au-steps-bar span.on b { background: var(--accent); border-color: var(--accent); color: var(--accent-on); }
.au-steps-bar span.done b { background: var(--text); border-color: var(--text); color: var(--surface); }
.au-section-label { font-size: 11.5px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin: 4px 0 -4px; }

/* Erros */
.au-error { position: relative; text-align: center; }
.au-error-icon { width: 76px; height: 76px; margin: 0 auto 18px; border-radius: 24px; display: grid; place-content: center; font-size: 36px; background: var(--accent-soft); color: var(--accent-ink); box-shadow: 0 0 0 10px color-mix(in srgb, var(--accent-soft) 45%, transparent); }
.au-error-icon.danger { background: var(--danger-soft); color: var(--danger); box-shadow: 0 0 0 10px color-mix(in srgb, var(--danger-soft) 45%, transparent); }
.au-error .au-error-code { font-size: 14px; font-weight: 700; letter-spacing: .12em; color: var(--muted); margin-bottom: 8px; }
.au-error h1 { font-size: 26px; font-weight: 700; letter-spacing: -.025em; }
.au-error p { margin: 8px auto 24px; color: var(--muted); max-width: 380px; font-size: 14.5px; }
.au-actions { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.au-actions .au-btn { padding: 0 20px; text-decoration: none; }
.au-error code.au-code { text-align: left; margin: 0 0 20px; }
.au-glow { position: fixed; inset: auto auto -260px -200px; width: 620px; height: 620px; border-radius: 50%; background: radial-gradient(circle, var(--accent-soft-2), transparent 65%); pointer-events: none; }

@media (max-width: 900px) {
  .au-mobile-brand { display: flex; justify-content: center; margin-bottom: 26px; }
  .au-mobile-brand img { width: auto; height: 72px; }
}
@media (max-width: 520px) {
  .au-card { padding: 26px 20px 22px; border-radius: var(--r-xl); box-shadow: var(--shadow-sm); }
  .au-main { padding: 64px 16px 24px; }
}
