/* =====================================================================
   Protótipo do Estoque · Células, Usuários, Minha conta e Diagnóstico
   ===================================================================== */

.e-celulas-tela { display: grid; gap: .9rem; }
.e-celulas-tela .e-barra { margin: 0; }
.e-dep-cor { width: 14px; height: 14px; border-radius: 4px; background: var(--cor, var(--p-vermelho)); flex: 0 0 14px; }
.e-departamento .p-cartao-corpo { font-size: .8rem; color: var(--p-cinza); }
.e-departamento .p-cartao-corpo .p-alerta { margin: .6rem 0 0; }
.e-tabela-celulas input:not([type="checkbox"]) {
    width: 100%; min-width: 4rem; padding: .3rem .45rem;
    border: 1px solid var(--p-borda-forte); border-radius: 6px; background: #fff;
    font-family: inherit; font-size: .78rem; color: var(--p-preto);
}
.e-tabela-celulas input[type="number"] { width: 4rem; text-align: right; }
.e-tabela-celulas input:focus { border-color: var(--p-vermelho); outline: none; }

.e-legenda-perfis { display: grid; gap: .15rem; font-size: .74rem; color: var(--p-cinza); }
.e-legenda-perfis strong { color: var(--p-preto); }

.e-conta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.e-conta .p-form .p-btn { justify-self: start; }
.e-conta-ajuda { padding: .6rem .9rem; }
.e-conta-atividade { grid-column: 1 / -1; }

.e-diag { display: grid; gap: .8rem; }
.e-diag .e-barra { margin: 0; }
.e-diag-lista li { display: flex; align-items: flex-start; gap: .6rem; padding: .55rem .9rem; border-bottom: 1px solid var(--p-borda); font-size: .78rem; }
.e-diag-lista li:last-child { border-bottom: 0; }
.e-diag-lista li > span:last-child { display: grid; }
.e-diag-lista strong { color: var(--p-preto); }
.e-diag-lista small { color: var(--p-cinza); font-size: .7rem; }
.e-diag-sinal { display: grid; place-items: center; width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%; background: var(--p-verde-claro); color: var(--p-verde-escuro); }
.e-diag-sinal .p-icone { width: 13px; height: 13px; }
.e-diag-lista li.info .e-diag-sinal { background: var(--p-azul-claro); color: var(--p-azul); }
.e-diag-lista li.falha .e-diag-sinal { background: var(--p-vermelho-claro); color: var(--p-vermelho); }

@container (max-width: 760px) {
    .e-conta { grid-template-columns: 1fr; }
}