/* ============================================================================
   Login, cadastro, recuperação e redefinição de senha no visual da landing
   (27/09/2026). Carregado DEPOIS do <style> de cada página: só troca a pele.
   Nada de id, campo ou JS muda; as quatro páginas usam as mesmas classes
   (auth-head, login-wrapper, login-card, input-group-modern, btn-login...).
   Paleta = a do sistema (tema Falcon), a mesma de assets/landing/lp.css.
   ============================================================================ */

:root {
    --ink: #0b1727; --ink-2: #344050;
    --gray: #5e6e82; --gray-2: #9da9bb; --muted: #5e6e82;
    --line: #e7edf6; --line-2: #d8e2ef;
    --paper: #ffffff; --paper-2: #f9fafd;
    --brand: #2c7be5; --brand-dark: #1f63c6;
    --brand-soft: #e2edfb; --brand-line: #cfe0f7;
    --ok: #00a862; --ok-soft: #e6f9f0; --ok-line: #b3ecd2;
    --err: #e63757; --err-soft: #fdecef; --err-line: #f7c1cb;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif !important;
    color: var(--ink);
    background: linear-gradient(180deg, #fff 0%, #f9fafd 45%, #edf2f9 100%) fixed;
}
.auth-glow {
    top: -420px; left: auto; right: -300px; transform: none;
    width: 900px; height: 900px; border-radius: 50%;
    background: radial-gradient(circle, rgba(44, 123, 229, .14), transparent 62%);
}
body::after {
    content: ''; position: fixed; left: -320px; bottom: -380px; width: 700px; height: 700px; border-radius: 50%;
    background: radial-gradient(circle, rgba(39, 188, 253, .13), transparent 62%); pointer-events: none; z-index: 0;
}

/* cabeçalho: a barra branca da landing */
.auth-head {
    max-width: none; margin: 0 0 8px; padding: 0 max(24px, calc((100vw - 1220px) / 2 + 24px));
    height: 68px; background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--line-2);
}
.auth-logo img { width: 30px; height: 30px; }
.font-logo { font-size: 27px; color: var(--ink-2); margin-top: 6px; }
.auth-back {
    font-weight: 600; font-size: 14.5px; color: var(--ink-2);
    border: 1px solid var(--line-2); border-radius: 8px; padding: 0 16px; height: 40px;
    box-shadow: none; transition: border-color .15s, color .15s;
}
.auth-back:hover { background: #fff; border-color: var(--brand); color: var(--brand); }

/* cabeçalho do formulário */
.login-wrapper { padding-top: clamp(28px, 5vw, 56px); }
.eyebrow {
    font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none;
    color: var(--brand-dark); background: var(--brand-soft); padding: 5px 12px; border-radius: 999px;
}
.login-title { color: var(--ink); font-weight: 800; letter-spacing: -.035em; font-size: clamp(28px, 3.6vw, 38px); }
.login-subtitle { color: var(--gray); font-size: 16px; }

/* cartão */
.login-card {
    border: 1px solid var(--line-2); border-radius: 16px; padding: 32px;
    box-shadow: 0 30px 60px -12px rgba(50, 50, 93, .18), 0 18px 36px -18px rgba(0, 0, 0, .2);
}
.form-label { font-weight: 600; font-size: 13.5px; color: var(--ink-2); }
.input-group-modern .form-control,
.login-card .form-control,
.login-card .form-select {
    border: 1px solid var(--line-2); border-radius: 8px; background: #fff; color: var(--ink);
    font-family: inherit;
}
.input-group-modern .form-control { height: 48px; }
.input-group-modern .form-control:focus,
.login-card .form-control:focus,
.login-card .form-select:focus {
    border-color: var(--brand); box-shadow: 0 0 0 3px rgba(44, 123, 229, .15);
}
.input-icon, .toggle-password { color: var(--gray-2); }

/* botão principal: o mesmo da landing */
.btn-login {
    height: 50px; border-radius: 10px; background: var(--brand); font-weight: 600;
    box-shadow: 0 4px 12px -2px rgba(44, 123, 229, .45);
}
.btn-login:hover:not(:disabled) { background: var(--brand-dark); box-shadow: 0 8px 20px -4px rgba(44, 123, 229, .55); }

.forgot-link, .bottom-text a, .support-box a, .success-box a, .state-box a { color: var(--brand); font-weight: 600; }
.forgot-link:hover, .support-box a:hover { color: var(--brand-dark); }
.support-box { background: #f1f6fd; border: 1px solid var(--brand-soft); border-radius: 10px; color: var(--gray); }
.support-box strong { color: var(--ink-2); }

.alert-login { border-radius: 10px; }
.alert-login.alert-danger-custom { color: #b0213d; }
.alert-login.alert-success-custom { color: #007a47; }

.lgpd-badge { background: var(--ok-soft); color: #007a47; border-color: var(--ok-line); font-weight: 700; }
.auth-foot { color: var(--gray); }

.success-icon, .state-icon, .mobile-block-icon { border-radius: 14px; }
.success-box h3, .state-box h3, .mobile-block-title { color: var(--ink); }
.mobile-block-card { border: 1px solid var(--line-2); border-radius: 16px; box-shadow: 0 30px 60px -12px rgba(50, 50, 93, .18); }

@media (max-width: 575.98px) {
    .auth-head { padding: 0 16px; }
    .login-card { padding: 24px 18px; }
}