/* Visual original do ED3, com login em duas etapas do Alloha Doctor. */
.login-page { margin-inline: auto; }
.login-card .primary { width: 100%; }
.login-card .login-status { margin: 18px 0 0; font-size: 12px; color: var(--text-secondary); }
.login-card > small { display: block; }
.preventiva-stages { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; align-items: center; text-align: center; margin-top: 12px; color: #003bde; font-size: 9px; }
.preventiva-stages span { padding: 5px 7px; border: 1px solid #c9dbff; border-radius: 20px; background: #f2f7ff; }
.login-art .sheet-heading > span { font-size: 8px; letter-spacing: .06em; }
.login-art .sheet-footer { justify-content: flex-end; }
.login-art .medical-icons { stroke-width: 1.8; }
.medical-icons .medical-surface { fill: var(--surface); }
.medical-icons .medical-green { stroke: var(--brand-green); fill: var(--brand-green); fill-opacity: .15; }
.medical-icons .medical-needle { stroke: var(--brand-green); stroke-width: 2.5; }
.login-art .medical-icons .medical-pivot { fill: var(--accent); }

.medical-icons .approval-stamp { color: var(--accent); stroke: var(--accent); stroke-width: 1.8; }
.login-card [hidden] { display: none !important; }
.login-card .login-form { margin-top: 22px; }
.login-card .login-form .primary { justify-content: center; }
.login-card #login-feedback, .login-card #mfa-help, .login-card #mfa-note { font-size: 12px; line-height: 1.6; color: var(--text-secondary); }
.login-card #mfa-account { font-weight: 600; overflow-wrap: anywhere; }
.login-card #mfa-qr { display: block; max-width: 100%; height: auto; margin: 18px auto; border-radius: 12px; background: white; padding: 8px; }
.login-card #mfa-code { text-align: center; font-size: 22px; letter-spacing: .25em; }
.login-card .login-back { display: block; margin: 14px auto 0; background: transparent; border: 0; color: var(--accent); padding: 8px 12px; }
.login-links {display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:16px 0}
.login-links button {border:0;background:transparent;color:var(--accent);font:inherit;text-decoration:underline;cursor:pointer;padding:6px 0}
#access-panel {margin-top:18px;border-top:1px solid var(--border,#d4dced);padding-top:18px}
#access-help,#access-feedback {font-size:13px;line-height:1.6}
.activation-progress {display:flex;gap:8px;list-style:none;padding:0;margin:18px 0;font-size:12px}
.activation-progress li {flex:1;min-width:0;padding:8px;border-bottom:3px solid var(--border,#d4dced);color:var(--text-secondary)}
.activation-progress li[aria-current="step"] {border-color:var(--accent);color:var(--text-primary);font-weight:700}
.activation-progress li.complete {border-color:var(--brand-green,#17825d)}
.access-identity {display:grid;gap:5px;background:var(--surface);border:1px solid var(--border,#d4dced);border-radius:10px;padding:12px;overflow-wrap:anywhere;font-size:14px}
.access-identity small {font-size:12px;color:var(--text-secondary);line-height:1.5}
.login-card .password-toggle {padding:6px 0;margin:0 0 12px;background:transparent;color:var(--accent);font-size:13px;text-decoration:underline;justify-self:start;min-height:34px}
.login-card details {margin:18px 0;padding:12px;border:1px solid var(--border,#d4dced);border-radius:10px;font-size:13px;line-height:1.6}
.login-card summary {cursor:pointer;font-weight:600;color:var(--text-primary)}
.login-card #mfa-secret {font-family:monospace;font-size:13px}
.login-card .mfa-recovery-note {font-size:12px;line-height:1.6;color:var(--text-secondary)}
.login-card #login-access-note {font-size:13px;line-height:1.6}
@media(max-width:650px){.login-page .login-story{display:none}.login-page{gap:22px}.login-card{padding:22px}.login-card input{font-size:16px}.activation-progress{font-size:12px}.login-links button{min-height:44px}}
