/* Recuperação de senha (esqueci-senha, recuperar-senha, redefinir-senha).
   Usa as cores do portal (portal-app.css: --pa-*). */
.auth-flow { padding: 2rem 16px 3.5rem; }
/* style.css deixa todo <p> com 17px, peso 600 e linha 1.8; aqui o texto é de formulário. */
.auth-flow p { font-weight: 400; line-height: 1.5; }
.auth-flow a:hover { color: #065f55; }
.auth-flow__card {
    max-width: 440px; margin: 0 auto; background: #fff;
    border: 1px solid var(--pa-border, #e1e9e8); border-radius: 16px;
    box-shadow: 0 18px 50px rgba(25, 46, 53, 0.08), 0 2px 10px rgba(25, 46, 53, 0.04);
    padding: 2rem 2rem 1.75rem;
}
.auth-flow__steps { display: flex; align-items: center; gap: 10px; margin-bottom: 1.5rem; }
.auth-flow__steps-label { font-size: 12px; font-weight: 650; color: var(--pa-muted, #61767c); white-space: nowrap; }
.auth-flow__steps-bars { display: flex; gap: 6px; flex: 1; }
.auth-flow__steps-bars span { height: 4px; flex: 1; border-radius: 999px; background: #e3ebe9; }
.auth-flow__steps-bars span.is-done { background: var(--pa-accent, #087f70); }
.auth-flow__icon {
    width: 52px; height: 52px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center;
    background: var(--pa-soft, #e8f5f0); color: var(--pa-accent, #087f70); font-size: 26px; margin-bottom: 1rem;
}
.portal-app .auth-flow__title { margin: 0 0 .5rem; font-size: 1.6rem; font-weight: 750; letter-spacing: -0.02em; line-height: 1.2; color: var(--pa-ink, #192e35); }
.auth-flow__lead { margin: 0 0 1.5rem; font-size: 15px; line-height: 1.55; color: var(--pa-muted, #61767c); }
.auth-flow__lead strong { color: var(--pa-ink, #192e35); font-weight: 650; word-break: break-all; }
.auth-flow__lead a { color: var(--pa-accent, #087f70); font-weight: 600; white-space: nowrap; }
.auth-flow .form-control { border-radius: 8px; }
.auth-flow .btn { border-radius: 8px; font-weight: 600; min-height: 46px; }
.auth-flow .btn-primary:disabled { opacity: .7; }

/* Campo do código */
.auth-code__label { display: block; margin-bottom: .4rem; font-size: 13px; font-weight: 650; color: var(--pa-ink, #192e35); }
.auth-code__input {
    height: 60px; text-align: center; font-size: 1.75rem; font-weight: 700; letter-spacing: .35em; padding-left: .35em;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--pa-ink, #192e35);
}
.auth-code__input::placeholder { color: #c4d2cf; letter-spacing: .35em; }
.auth-code__hint { margin: .45rem 0 0; font-size: 12.5px; color: var(--pa-muted, #61767c); }

/* Reenviar e ajuda */
.auth-flow__resend { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 1rem; font-size: 14px; color: var(--pa-muted, #61767c); flex-wrap: wrap; }
.auth-flow__link-button { background: none; border: 0; padding: 0; color: var(--pa-accent, #087f70); font-weight: 650; }
.auth-flow__link-button:disabled { color: #8fa3a0; cursor: default; font-weight: 550; }
.auth-flow__help { margin: 1.25rem 0 0; padding: .85rem 1rem; border-radius: 10px; background: #f5f8f7; font-size: 13px; line-height: 1.5; color: var(--pa-muted, #61767c); }
.auth-flow__help ul { margin: 0; padding-left: 1.1rem; }
.auth-flow__help li + li { margin-top: .25rem; }
.auth-flow__footer { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid #eef3f2; text-align: center; font-size: 14px; }
.auth-flow__footer a { color: var(--pa-muted, #61767c); display: inline-flex; align-items: center; gap: 6px; }
.auth-flow__footer a:hover { color: var(--pa-accent, #087f70); }

/* Senha nova */
.auth-password { position: relative; }
.auth-password .form-control { padding-right: 3rem; }
.auth-password__toggle {
    position: absolute; top: 50%; right: .6rem; transform: translateY(-50%); z-index: 5;
    width: 36px; height: 36px; border: 0; border-radius: 8px; background: transparent; color: #6f8582; font-size: 20px;
    display: inline-flex; align-items: center; justify-content: center;
}
.auth-password__toggle:hover { background: #f1f5f4; color: var(--pa-ink, #192e35); }
.auth-rules { list-style: none; margin: .25rem 0 1rem; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .35rem .75rem; font-size: 13px; color: var(--pa-muted, #61767c); }
.auth-rules li { display: flex; align-items: center; gap: 6px; }
.auth-rules li i { font-size: 16px; color: #b8c7c4; }
.auth-rules li.is-met { color: #0b6b5e; }
.auth-rules li.is-met i { color: var(--pa-accent, #087f70); }
.auth-match { min-height: 20px; margin: -.5rem 0 1rem; font-size: 13px; }
.auth-match.is-ok { color: #0b6b5e; }
.auth-match.is-bad { color: #b42318; }

/* Validação do link do email */
.auth-flow__bridge { text-align: center; }
.auth-flow__spinner { width: 34px; height: 34px; border: 3px solid #e3ebe9; border-top-color: var(--pa-accent, #087f70); border-radius: 50%; margin: .5rem auto 1rem; animation: auth-spin .9s linear infinite; }
@keyframes auth-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .auth-flow__spinner { animation-duration: 3s; } }

@media (max-width: 480px) {
    .auth-flow { padding-top: 1rem; }
    .auth-flow__card { padding: 1.5rem 1.25rem 1.25rem; border-radius: 14px; }
    .portal-app .auth-flow__title { font-size: 1.4rem; }
    .auth-rules { grid-template-columns: 1fr; }
}