/* Tela de login — palco imersivo em cor primária (aurora animada) com cartão de vidro. Independe do tema claro/escuro. */
.lg-body { --p: var(--cor-primaria, #1a9c6a); margin: 0; min-height: 100vh; background: #060b10; color: #0f1b26; font-family: "Segoe UI", system-ui, -apple-system, Roboto, sans-serif; overflow-x: hidden; }

/* fundo: três focos de cor à deriva + grade suave + vinheta */
.lg-fundo { position: fixed; inset: 0; z-index: 0; overflow: hidden; background: radial-gradient(120% 90% at 50% 120%, color-mix(in srgb, var(--p) 22%, #060b10), #060b10 65%); }
.lg-fundo::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px); background-size: 56px 56px; mask-image: radial-gradient(70% 70% at 50% 50%, #000, transparent 85%); -webkit-mask-image: radial-gradient(70% 70% at 50% 50%, #000, transparent 85%); }
.lg-fundo i { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .55; will-change: transform; }
.lg-fundo i:nth-child(1) { width: 46vmax; height: 46vmax; left: -12vmax; top: -14vmax; background: var(--p); animation: lg-deriva-a 22s ease-in-out infinite alternate; }
.lg-fundo i:nth-child(2) { width: 38vmax; height: 38vmax; right: -10vmax; bottom: -12vmax; background: color-mix(in srgb, var(--p) 55%, #2b6cff); animation: lg-deriva-b 26s ease-in-out infinite alternate; }
.lg-fundo i:nth-child(3) { width: 26vmax; height: 26vmax; left: 38%; top: 55%; background: color-mix(in srgb, var(--p) 60%, #00e0c6); opacity: .32; animation: lg-deriva-c 30s ease-in-out infinite alternate; }
@keyframes lg-deriva-a { to { transform: translate(14vmax, 10vmax) scale(1.15); } }
@keyframes lg-deriva-b { to { transform: translate(-12vmax, -8vmax) scale(1.2); } }
@keyframes lg-deriva-c { to { transform: translate(-16vmax, -14vmax) scale(.85); } }

.lg { position: relative; z-index: 1; min-height: 100vh; display: grid; place-items: center; padding: 1.5rem 1rem; }

/* cartão de vidro */
.lg-cartao { width: 100%; max-width: 410px; padding: 2.2rem 2.1rem 1.9rem; border-radius: 1.6rem; background: rgba(255, 255, 255, .97); border: 1px solid rgba(255, 255, 255, .6);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .5), 0 0 0 1px rgba(255, 255, 255, .06) inset, 0 0 90px color-mix(in srgb, var(--p) 30%, transparent);
    -webkit-backdrop-filter: blur(22px) saturate(140%); backdrop-filter: blur(22px) saturate(140%); animation: lg-entra .8s cubic-bezier(.2, .9, .3, 1) both; }
@keyframes lg-entra { from { opacity: 0; transform: translateY(26px) scale(.97); } to { opacity: 1; transform: none; } }
.lg-cab { text-align: center; margin-bottom: 1.4rem; }
.lg-cab > * { animation: lg-sobe .7s both; }
.lg-cab .lg-logo { animation-delay: .15s; } .lg-cab h1 { animation-delay: .25s; } .lg-cab p { animation-delay: .32s; }
@keyframes lg-sobe { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.lg-logo { display: inline-flex; align-items: center; gap: .6rem; margin-bottom: 1.1rem; font-size: 1.05rem; color: var(--p); }
.lg-logo i { font-size: 1.7rem; } .lg-logo b { color: #0f1b26; }
.lg-logo img { max-height: 54px; max-width: 230px; display: block; }
.lg-cab h1 { margin: 0 0 .25rem; font-size: 1.6rem; font-weight: 800; letter-spacing: -.025em; color: #0f1b26; }
.lg-cab p { margin: 0; font-size: .92rem; color: #5b6b7b; }

/* abas com marcador deslizante */
.lg-abas { position: relative; display: grid; grid-template-columns: 1fr 1fr; padding: .28rem; margin-bottom: 1.3rem; border-radius: .95rem; background: rgba(15, 27, 38, .07); }
.lg-abas__marca { position: absolute; top: .28rem; bottom: .28rem; left: .28rem; width: calc(50% - .28rem); border-radius: .72rem; background: #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, .14); transition: transform .35s cubic-bezier(.3, 1.2, .4, 1); }
.lg-abas[data-ativa="1"] .lg-abas__marca { transform: translateX(100%); }
.lg-aba { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; border: 0; background: none; padding: .55rem; font-size: .86rem; font-weight: 600; color: #5b6b7b; transition: color .25s; }
.lg-aba.active { color: var(--p); }

.lg-painel { animation: lg-troca .4s both; }
.lg-painel[hidden] { display: none; }
@keyframes lg-troca { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* campos com rótulo flutuante */
.lg-campo { position: relative; display: block; margin-bottom: .95rem; }
.lg-campo input { width: 100%; height: 3.4rem; padding: 1.25rem 2.7rem .35rem 2.6rem; border-radius: .95rem; border: 1.5px solid #dbe2ea; background: #fff; color: #0f1b26; font-size: .98rem; outline: none; transition: border-color .2s, box-shadow .2s; }
.lg-campo input:focus { border-color: var(--p); box-shadow: 0 0 0 .28rem color-mix(in srgb, var(--p) 20%, transparent); }
.lg-campo > span { position: absolute; left: 2.6rem; top: 50%; transform: translateY(-50%); font-size: .95rem; color: #7a8896; pointer-events: none; transition: all .18s ease; }
.lg-campo input:focus + span, .lg-campo input:not(:placeholder-shown) + span { top: .62rem; transform: none; font-size: .68rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--p); }
.lg-campo > i { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: #93a1af; transition: color .2s; }
.lg-campo input:focus ~ i { color: var(--p); }
.lg-olho { position: absolute; right: .35rem; top: 50%; transform: translateY(-50%); width: 2.4rem; height: 2.4rem; border: 0; background: none; border-radius: .6rem; color: #93a1af; }
.lg-olho:hover { color: var(--p); background: color-mix(in srgb, var(--p) 10%, transparent); }
.lg-olho i { position: static; transform: none; color: inherit; }
.lg-campo input:-webkit-autofill { -webkit-box-shadow: 0 0 0 40px #fff inset; -webkit-text-fill-color: #0f1b26; }

.lg-botao { position: relative; overflow: hidden; width: 100%; height: 3.3rem; margin-top: .35rem; display: flex; align-items: center; justify-content: center; gap: .6rem; border: 0; border-radius: .95rem; font-size: 1rem; font-weight: 700; color: #fff;
    background: linear-gradient(135deg, var(--p), color-mix(in srgb, var(--p) 62%, #000)); box-shadow: 0 12px 28px color-mix(in srgb, var(--p) 45%, transparent); transition: transform .18s, box-shadow .18s; }
.lg-botao::after { content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .35), transparent); transform: skewX(-20deg); transition: left .7s; }
.lg-botao:hover { transform: translateY(-2px); box-shadow: 0 18px 36px color-mix(in srgb, var(--p) 55%, transparent); }
.lg-botao:hover::after { left: 130%; }
.lg-botao i { transition: transform .2s; } .lg-botao:hover i { transform: translateX(4px); }
.lg-botao:active { transform: translateY(0); }
.lg-botao.carregando { pointer-events: none; opacity: .85; }
.lg-botao.carregando i { display: none; }
.lg-botao.carregando span::before { content: ""; display: inline-block; width: 1em; height: 1em; margin-right: .6rem; vertical-align: -.15em; border: 2px solid rgba(255, 255, 255, .4); border-top-color: #fff; border-radius: 50%; animation: lg-gira .7s linear infinite; }
@keyframes lg-gira { to { transform: rotate(360deg); } }
.lg-link { display: block; text-align: center; margin-top: 1.1rem; font-size: .85rem; font-weight: 600; color: #5b6b7b; text-decoration: none; transition: color .2s; }
.lg-link:hover { color: var(--p); }

.lg-aviso { display: flex; gap: .55rem; align-items: flex-start; margin-bottom: 1rem; padding: .7rem .85rem; border-radius: .8rem; font-size: .85rem; line-height: 1.4; animation: lg-sobe .4s both; }
.lg-aviso--erro { background: #fdecec; color: #a11d2a; } .lg-aviso--ok { background: #e6f6ee; color: #14724a; } .lg-aviso--atencao { background: #fff4de; color: #8a5a00; }

@media (max-width: 480px) { .lg-cartao { padding: 1.8rem 1.4rem 1.5rem; border-radius: 1.3rem; } }
@media (prefers-reduced-motion: reduce) { .lg-fundo i, .lg-cartao, .lg-cab > *, .lg-painel, .lg-aviso { animation: none !important; } .lg-botao::after { display: none; } }