:root {
    color-scheme: dark;
    --recovery-bg: #0a130f;
    --recovery-card: #13221a;
    --recovery-field: #0a1510;
    --recovery-text: #f1f7f2;
    --recovery-muted: #a9bbb0;
    --recovery-border: #263b2e;
    --recovery-accent: #79dda0;
    --recovery-accent-text: #07140d;
}

:root[data-theme="light"] {
    color-scheme: light;
    --recovery-bg: #f4f8f5;
    --recovery-card: #fff;
    --recovery-field: #f6faf7;
    --recovery-text: #20362a;
    --recovery-muted: #64776b;
    --recovery-border: #d6e4d9;
    --recovery-accent: #4c9d6b;
    --recovery-accent-text: #fff;
}

* { box-sizing: border-box; }

body.recovery-page {
    min-height: 100vh;
    margin: 0;
    padding: 32px 16px;
    display: grid;
    place-items: center;
    color: var(--recovery-text);
    background: radial-gradient(ellipse at 50% 12%, color-mix(in srgb, var(--recovery-accent) 11%, transparent), transparent 46%), var(--recovery-bg);
    font-family: "Plus Jakarta Sans", Arial, sans-serif;
}

.recovery-page * { font-family: inherit; }

.recovery-header {
    position: fixed;
    z-index: 5;
    top: 16px;
    right: 20px;
}

.recovery-header .navbar { display: flex; align-items: center; }

.recovery-header .theme-toggle {
    width: 44px;
    height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--recovery-border);
    border-radius: 50%;
    color: var(--recovery-text);
    background: var(--recovery-card);
    cursor: pointer;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.recovery-header .theme-toggle svg { display: block; width: 20px; height: 20px; }
.recovery-header .theme-toggle:hover { border-color: var(--recovery-accent); transform: translateY(-1px); }
.recovery-header .theme-toggle:focus-visible { outline: 2px solid var(--recovery-accent); outline-offset: 3px; }

.recovery-card {
    width: min(100%, 520px);
    padding: 34px clamp(22px, 6vw, 48px) 32px;
    border: 1px solid var(--recovery-border);
    border-radius: 24px;
    background: var(--recovery-card);
    box-shadow: 0 20px 56px rgba(0, 0, 0, .16);
    text-align: center;
}

.recovery-brand {
    width: fit-content;
    max-width: 100%;
    margin: 0 auto 24px;
    display: flex;
    justify-content: center;
}

.recovery-brand img {
    display: block;
    width: min(240px, 70vw);
    height: 92px;
    object-fit: contain;
}

.recovery-card h1 {
    margin: 0;
    color: var(--recovery-text);
    font-size: clamp(25px, 5vw, 30px);
    line-height: 1.2;
    letter-spacing: -.04em;
}

.recovery-description {
    max-width: 390px;
    margin: 9px auto 26px;
    color: var(--recovery-muted);
    font-size: 15px;
    line-height: 1.6;
}

.recovery-card form { display: grid; gap: 20px; text-align: left; }
.recovery-card .campo { display: grid; gap: 8px; }
.recovery-card label { color: var(--recovery-text); font-size: 14px; font-weight: 700; }

.reset-card {
    width: min(100%, 440px);
    padding: 24px 22px 22px;
    text-align: left;
}
.reset-card .recovery-brand { display: none; }
.reset-card h1 { text-align: left; }
.reset-card .recovery-description { margin: 5px 0 20px; text-align: left; }
.reset-card form { gap: 15px; }
.reset-card .campo { grid-template-columns: minmax(0, 1fr); gap: 7px; }
.reset-card label { text-align: left; }
.reset-card .campo-senha { position: relative; width: 100%; }
.reset-card .campo-senha input { padding-right: 58px; }
.reset-card .alternar-senha {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 40px;
    height: 38px;
    padding: 6px;
    display: grid;
    place-items: center;
    transform: translateY(-50%);
    border: 0;
    border-radius: 10px;
    color: var(--recovery-accent);
    background: transparent;
    cursor: pointer;
}
.reset-card .alternar-senha svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.reset-card .alternar-senha .risco-olho { opacity: 1; transition: opacity .15s ease; }
.reset-card .alternar-senha.senha-visivel .risco-olho { opacity: 0; }
.reset-card .alternar-senha:focus-visible { outline: 2px solid var(--recovery-accent); outline-offset: 2px; }

.password-strength { margin-top: 2px; }
.password-strength-bars { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
.password-strength-bars i { height: 5px; border-radius: 99px; background: var(--recovery-border); transition: background-color .16s ease; }
.password-strength-text { margin: 7px 0 0; color: var(--recovery-muted); font-size: 12px; line-height: 1.45; }
.password-strength[data-strength="1"] .password-strength-bars i.is-active { background: #e57373; }
.password-strength[data-strength="2"] .password-strength-bars i.is-active { background: #f0aa55; }
.password-strength[data-strength="3"] .password-strength-bars i.is-active { background: #c4d96a; }
.password-strength[data-strength="4"] .password-strength-bars i.is-active { background: var(--recovery-accent); }
.password-match { min-height: 17px; margin: -3px 0 0; color: var(--recovery-muted); font-size: 12px; }
.password-match[data-match="true"] { color: var(--recovery-accent); }
.password-match[data-match="false"] { color: #e57373; }
.reset-card .recovery-submit { width: 100%; margin-top: 2px; }
.reset-card .recovery-message { text-align: left; }
.reset-card .back-to-login { display: flex; width: fit-content; margin: 12px auto 0; }

.recovery-card input {
    width: 100%;
    min-height: 48px;
    padding: 0 15px;
    border: 1px solid var(--recovery-border);
    border-radius: 12px;
    outline: none;
    color: var(--recovery-text);
    background: var(--recovery-field);
    font-size: 15px;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.recovery-card input::placeholder { color: var(--recovery-muted); opacity: .75; }
.recovery-card input:focus { border-color: var(--recovery-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--recovery-accent) 20%, transparent); }

.recovery-submit {
    min-height: 49px;
    padding: 0 20px;
    border: 0;
    border-radius: 13px;
    color: var(--recovery-accent-text);
    background: var(--recovery-accent);
    font-size: 15px;
    font-weight: 800;
    cursor: pointer;
    transition: filter .18s ease, transform .18s ease;
}

.recovery-submit:hover:not(:disabled) { filter: brightness(1.06); transform: translateY(-1px); }
.recovery-submit:focus-visible, .back-to-login:focus-visible { outline: 2px solid var(--recovery-accent); outline-offset: 3px; }
.recovery-submit:disabled { cursor: wait; opacity: .72; }

.recovery-message {
    min-height: 20px;
    margin: 12px 0 8px;
    color: var(--recovery-muted);
    font-size: 13px;
    line-height: 1.5;
}

.back-to-login {
    min-height: 38px;
    margin-top: 4px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: var(--recovery-accent);
    background: color-mix(in srgb, var(--recovery-accent) 12%, var(--recovery-card));
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: background .18s ease;
}

.back-to-login:hover { background: color-mix(in srgb, var(--recovery-accent) 20%, var(--recovery-card)); }

/* Estados do fluxo de recuperação, mantidos dentro de esqueci-senha.html. */
.recovery-card .recovery-step[hidden] { display: none !important; }
.recovery-card [hidden] { display: none !important; }
.recovery-card .recovery-step:not([hidden]) { display: block; }
.recovery-card .recovery-global-login { display: flex; width: fit-content; margin: 12px auto 0; }
.recovery-card .recovery-secondary { border: 0; font: inherit; cursor: pointer; }
.recovery-card .reset-content { text-align: left; }
.recovery-card .reset-content h1 { text-align: left; }
.recovery-card .reset-content .recovery-description { margin: 6px 0 20px; text-align: left; }
.recovery-card .reset-content form { gap: 15px; }
.recovery-card .reset-content .campo { grid-template-columns: minmax(0, 1fr); gap: 7px; }
.recovery-card .reset-content label { text-align: left; }
.recovery-card .reset-content .campo-senha { position: relative; width: 100%; }
.recovery-card .reset-content .campo-senha input { padding-right: 58px; }
.recovery-card .reset-content .alternar-senha {
    position: absolute; top: 50%; right: 10px; width: 40px; height: 38px; padding: 6px;
    display: grid; place-items: center; transform: translateY(-50%); border: 0; border-radius: 10px;
    color: var(--recovery-accent); background: transparent; cursor: pointer;
}
.recovery-card .reset-content .alternar-senha svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.recovery-card .reset-content .alternar-senha .risco-olho { opacity: 1; transition: opacity .15s ease; }
.recovery-card .reset-content .alternar-senha.senha-visivel .risco-olho { opacity: 0; }
.recovery-card .reset-content .recovery-message { text-align: left; }
.recovery-card .reset-content .recovery-submit { width: 100%; }

@media (max-width: 480px) {
    body.recovery-page { padding: 18px 12px; }
    .recovery-header { top: 12px; right: 12px; }
    .recovery-header .theme-toggle { width: 40px; height: 40px; }
    .recovery-card { padding: 28px 20px 24px; border-radius: 20px; }
    .reset-card { padding: 23px 20px 21px; }
    .recovery-brand { margin-bottom: 19px; }
    .recovery-brand img { height: 76px; }
    .recovery-description { margin-bottom: 22px; font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    .recovery-header .theme-toggle, .recovery-card input, .recovery-submit, .back-to-login, .password-strength-bars i, .reset-card .alternar-senha .risco-olho, .reset-content .alternar-senha .risco-olho { transition: none; }
}