/* Tela de login (sem interatividade, por isso CSS próprio em vez dos componentes do MudBlazor), nas cores da logo:
   azul-escuro #01348F do "Nota" e azul #0271DB do "Fácil" (um tom mais escuro, para o texto branco ficar legível). */
.fundo-login {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f8;
    font-family: Roboto, "Segoe UI", Arial, sans-serif;
}

.caixa-login {
    width: min(380px, 92vw);
    background: #fff;
    padding: 32px;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
}

.caixa-login .logo-login { display: block; width: 220px; height: auto; margin: 0 auto 8px; }
.caixa-login h1 { margin: 0 0 4px; font-size: 1.5rem; color: #01348F; }
.caixa-login .subtitulo { margin: 0 0 20px; color: #666; text-align: center; }
.caixa-login label { display: block; margin: 12px 0 4px; font-size: .9rem; color: #333; }
.caixa-login input[type=email], .caixa-login input[type=password], .caixa-login input[type=text] {
    width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #ccc; border-radius: 4px; font-size: 1rem;
}
.caixa-login .lembrar { display: flex; gap: 8px; align-items: center; margin-top: 16px; }
.caixa-login button {
    width: 100%; margin-top: 20px; padding: 12px; border: 0; border-radius: 4px;
    background: #0271DB; color: #fff; font-size: 1rem; cursor: pointer;
}
.caixa-login button:hover { background: #01348F; }
.caixa-login .erro-campo, .alerta-login { color: #c62828; font-size: .85rem; }
.alerta-login { background: #fdecea; padding: 10px; border-radius: 4px; margin-bottom: 8px; }
.caixa-login .rodape-login { margin: 20px 0 0; text-align: center; font-size: .85rem; }
.caixa-login .rodape-login a { color: #666; }

/* Marca na barra superior: o desenho da logo num quadradinho branco e o nome em duas cores, como na logo. */
.marca-barra { display: flex; align-items: center; gap: 10px; margin-left: 8px; color: inherit; text-decoration: none; }
.marca-barra img { border-radius: 7px; background: #fff; }
.marca-barra .marca-nome { font-size: 1.35rem; font-weight: 800; letter-spacing: -.01em; }
.marca-barra .marca-facil { color: #5AA9FF; }

/* Seletor de empresa dentro da barra superior (fundo escuro). */
.seletor-empresa { min-width: 220px; max-width: 320px; background: #fff; border-radius: 4px; }

.lista-erros { margin: 0; padding-left: 18px; }