/* Estilos específicos da página login. */
:root {
    --bg:        #f7faf8;
    --bg-card:   #ffffff;
    --tx1:       #0b1f14;
    --tx2:       #2c5240;
    --tx3:       #5d8571;
    --bdr:       #e2ede6;
    --accent:    #10a35e;
    --accent-lt: #e3f6ec;
    --accent-dk: #0b8049;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
    font-family: 'Inter', -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
    background: var(--bg);
    background-image:
        radial-gradient(900px 460px at 80% -10%, var(--accent-lt), transparent 60%),
        radial-gradient(700px 420px at -10% 110%, var(--accent-lt), transparent 55%);
    color: var(--tx1);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.card {
    width: 100%;
    max-width: 420px;
    background: var(--bg-card);
    border: 1px solid var(--bdr);
    border-radius: 24px;
    box-shadow: 0 8px 40px rgba(11,31,20,.09), 0 2px 8px rgba(11,31,20,.04);
    padding: 40px 36px 32px;
    animation: entrar .4s cubic-bezier(.2,.7,.3,1) both;
}
@keyframes entrar { from { opacity: 0; transform: translateY(14px) scale(.99); } to { opacity: 1; transform: none; } }

.logo {
    width: 52px; height: 52px; border-radius: 16px;
    background: linear-gradient(135deg,#17c072,#0b8049);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 18px;
    box-shadow: 0 8px 24px rgba(16,163,94,.35);
}
h1 { font-family: 'Sora', sans-serif; font-size: 22px; font-weight: 800; text-align: center; letter-spacing: -.03em; }
.sub { font-size: 13.5px; color: var(--tx3); text-align: center; margin-top: 6px; margin-bottom: 26px; }

.abas {
    display: flex; background: var(--bg); border: 1px solid var(--bdr);
    border-radius: 999px; padding: 4px; margin-bottom: 24px;
}
.aba {
    flex: 1; border: none; background: transparent; border-radius: 999px;
    padding: 8px 0; font-size: 13.5px; font-weight: 600; color: var(--tx3);
    cursor: pointer; transition: all .18s; font-family: inherit;
}
.aba.ativa { background: var(--bg-card); color: var(--accent-dk); box-shadow: 0 2px 8px rgba(11,31,20,.08); }

label { display: block; font-size: 12.5px; font-weight: 600; color: var(--tx2); margin-bottom: 6px; }
input {
    width: 100%; padding: 12px 14px; font-size: 14px; font-family: inherit;
    border: 1.5px solid var(--bdr); border-radius: 12px; background: #fbfdfc;
    color: var(--tx1); transition: border-color .15s, box-shadow .15s;
    margin-bottom: 16px;
}
input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3.5px var(--accent-lt); }

.btn {
    width: 100%; padding: 13px; border: none; border-radius: 999px;
    background: var(--accent); color: #fff; font-size: 14.5px; font-weight: 700;
    font-family: inherit; cursor: pointer;
    box-shadow: 0 6px 18px rgba(16,163,94,.32);
    transition: background .15s, transform .1s;
    margin-top: 4px;
}
.btn:hover { background: var(--accent-dk); transform: translateY(-1px); }
.btn:active { transform: none; }
.btn:disabled { opacity: .6; cursor: wait; transform: none; }

.erro {
    display: none; background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c;
    font-size: 13px; padding: 10px 14px; border-radius: 12px; margin-bottom: 16px;
}
.rodape { text-align: center; font-size: 12px; color: var(--tx3); margin-top: 26px; }