/* =============================================================================
 * Tela de entrada
 * =============================================================================
 * Fica sobre o painel até haver sessão válida. Não é proteção — quem protege é
 * o banco, pelas políticas por loja. Se alguém esconder esta camada pelo
 * console, continuará sem ver dado nenhum, porque as consultas vão sem token.
 * =========================================================================== */

.entrada {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: grid;
    place-items: center;
    padding: 20px;
    background: linear-gradient(140deg, #E6F7F5 0%, #F7F9FC 55%, #EEF2F7 100%);
}
.entrada[hidden] { display: none; }

.entrada-cartao {
    width: 100%;
    max-width: 372px;
    background: var(--cartao);
    border: 1px solid var(--borda);
    border-radius: 14px;
    padding: 30px 28px 26px;
    box-shadow: 0 8px 28px rgba(26, 35, 48, .10);
}

.entrada-logo {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 22px;
}

.entrada-titulo {
    font-size: 17px;
    font-weight: 650;
    letter-spacing: -.3px;
    margin-bottom: 3px;
}
.entrada-sub {
    font-size: 13.5px;
    color: var(--texto-medio);
    margin-bottom: 20px;
}

.campo { margin-bottom: 14px; }
.campo label {
    display: block;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--texto-medio);
    margin-bottom: 5px;
}
.campo input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--borda-forte);
    border-radius: var(--raio-p);
    font-size: 14.5px;
    font-family: inherit;
    color: var(--texto);
    background: var(--cartao);
}
.campo input:focus {
    outline: none;
    border-color: var(--marca);
    box-shadow: 0 0 0 3px var(--marca-clara);
}
.campo input:disabled { background: var(--fundo); color: var(--texto-fraco); }

.entrada-btn {
    width: 100%;
    padding: 11px;
    margin-top: 6px;
    border: none;
    border-radius: var(--raio-p);
    background: var(--marca);
    color: #fff;
    font-size: 14.5px;
    font-weight: 650;
    font-family: inherit;
    cursor: pointer;
}
.entrada-btn:hover:not(:disabled) { background: var(--marca-escura); }
.entrada-btn:disabled { opacity: .6; cursor: progress; }

/* O recado de erro entra no fluxo em vez de flutuar: assim não cobre o campo
   que a pessoa precisa corrigir. */
.entrada-recado {
    margin-top: 14px;
    padding: 10px 12px;
    border-radius: var(--raio-p);
    font-size: 13px;
    border: 1px solid;
    display: none;
}
.entrada-recado[data-tipo="erro"] {
    display: block;
    background: var(--problema-bg);
    border-color: #F5B5B5;
    color: #A02020;
}
.entrada-recado[data-tipo="aviso"] {
    display: block;
    background: var(--aguardando-bg);
    border-color: #F5D9A4;
    color: #8A5B00;
}

.entrada-rodape {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--borda);
    font-size: 12px;
    color: var(--texto-fraco);
    text-align: center;
}

/* Sair fica no topo, junto do nome da loja. */
.btn-sair {
    border: 1px solid var(--borda-forte);
    background: var(--cartao);
    color: var(--texto-medio);
    border-radius: var(--raio-p);
    padding: 7px 12px;
    font-size: 12.5px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
}
.btn-sair:hover { background: var(--fundo); color: var(--texto); }

/* Enquanto os dados não chegam, o painel não deve mostrar zeros — pareceria
   um dia sem movimento. */
.carregando {
    padding: 60px 20px;
    text-align: center;
    color: var(--texto-fraco);
    font-size: 14px;
}