/* ==========================================================================
   Portal LC — identidade visual oficial LC Engenharia (Paleta 01 · Minimalismo Técnico)
   mesmos tokens do site institucional e do AprovaApp.
   ========================================================================== */
:root {
  --cor-fundo: #F6F5F2;
  --cor-vermelho: #C72E2E;
  --cor-vermelho-escuro: #A82424;
  --cor-bronze: #9A7553;
  --cor-grafite: #2E3135;
  --cor-linha: #D9D9D9;
  --cor-branco: #FFFFFF;
  --cor-texto-secundario: #6B7075;

  --fonte-titulo: 'Manrope', -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --fonte-corpo: 'IBM Plex Sans', -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --fonte-dado: 'IBM Plex Mono', monospace;
}

* { box-sizing: border-box; }
html, body {
  margin: 0;
  font-family: var(--fonte-corpo);
  background: var(--cor-fundo);
  color: var(--cor-grafite);
}
body { min-height: 100vh; }

a { color: var(--cor-vermelho); }

.topo {
  position: sticky; top: 0; z-index: 5;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; background: var(--cor-branco); border-bottom: 1px solid var(--cor-linha);
}
.topo h1 { font-family: var(--fonte-titulo); font-weight: 800; font-size: 16px; margin: 0; letter-spacing: -0.01em; }
.topo .sair { background: none; border: none; color: var(--cor-texto-secundario); font-size: 13px; cursor: pointer; font-family: var(--fonte-corpo); }
.marca { display: flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; }
.marca .logo-mini { background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 4px; padding: 2px 4px; display: flex; }
.marca .logo-mini img { height: 26px; display: block; }

.container { padding: 12px 16px 32px; max-width: 640px; margin: 0 auto; }
/* NexuApp e' pensado primeiro pra desktop (uso no dia a dia da equipe), mas continua
   funcionando em mobile — as grades abaixo usam auto-fill/media query pra se ajustar sozinhas,
   em vez de exigir um layout mobile separado. */
.container.largo { max-width: 1200px; padding: 20px 24px 40px; }

/* Detalhe da tarefa: coluna principal (dados/edicao) + coluna lateral (comentarios/anexos/
   historico) em desktop, empilhado em telas estreitas. */
.tarefa-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 860px) { .tarefa-grid { grid-template-columns: 1fr; } }

/* Administração: cards de configuração lado a lado; tabelas continuam full-width */
.admin-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; margin-bottom: 16px; }
@media (max-width: 860px) { .admin-grid { grid-template-columns: 1fr; } }

.card {
  background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 4px;
  padding: 16px; margin-bottom: 12px;
}

button.primario {
  width: 100%; padding: 12px; border: none; border-radius: 2px; background: var(--cor-vermelho);
  color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; font-family: var(--fonte-corpo);
}
button.primario:hover { background: var(--cor-vermelho-escuro); }
button.primario:disabled { background: var(--cor-linha); color: var(--cor-texto-secundario); cursor: not-allowed; }
button.perigo {
  background: var(--cor-branco); color: var(--cor-grafite); border: 1px solid var(--cor-grafite);
  font-weight: 600;
}
button.perigo:hover { background: var(--cor-grafite); color: var(--cor-fundo); }
button.secundario {
  border: 1px solid var(--cor-linha); border-radius: 2px; background: var(--cor-branco);
  color: var(--cor-grafite); font-size: 14px; cursor: pointer; font-family: var(--fonte-corpo);
}
button.secundario:hover { background: var(--cor-fundo); border-color: var(--cor-grafite); }

.acoes { display: flex; gap: 10px; margin-top: 20px; }
.acoes button { flex: 1; padding: 12px; }

.linha-checkbox { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--cor-texto-secundario); padding: 6px 0; }
.linha-checkbox input { width: auto; margin: 0; }
.subtitulo-menu { color: var(--cor-texto-secundario); font-size: 12px; margin-top: 2px; }

#listaObrasSienge { max-height: 360px; overflow-y: auto; border: 1px solid var(--cor-linha); border-radius: 4px; padding: 8px 12px; }

.vazio { text-align: center; color: var(--cor-texto-secundario); padding: 40px 16px; }

.badge {
  display: inline-block; font-size: 11px; padding: 2px 8px; border-radius: 2px;
  background: #F1E9E2; color: var(--cor-bronze); margin-top: 6px; font-family: var(--fonte-dado);
}

.campo { margin-bottom: 14px; }
.campo .rotulo { font-size: 12px; color: var(--cor-texto-secundario); margin-bottom: 3px; }
.campo .valor-campo { font-size: 15px; }

.voltar { color: var(--cor-texto-secundario); text-decoration: none; font-size: 13px; display: inline-block; margin-bottom: 10px; }
.voltar:hover { color: var(--cor-vermelho); }

.boas-vindas { text-align: center; padding: 24px 16px; }
.boas-vindas .nivel { color: var(--cor-texto-secundario); font-size: 13px; margin-top: 4px; }

.menu-inicio a {
  display: flex; align-items: center; gap: 14px; text-decoration: none; color: inherit;
  background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 4px;
  padding: 18px 16px; margin-bottom: 12px;
}
.menu-inicio a:active { background: #FBFAF8; }
.menu-inicio a:hover { border-color: var(--cor-bronze); }
.menu-inicio .icone-menu { font-size: 24px; }
.menu-inicio .titulo-menu { font-family: var(--fonte-titulo); font-weight: 700; font-size: 15px; }
.menu-inicio .subtitulo-menu { color: var(--cor-texto-secundario); font-size: 12px; margin-top: 2px; }

.marca-lc {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 28px 16px 12px; text-align: center;
}
.marca-lc-rotulo {
  font-family: var(--fonte-dado); font-size: 11px; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--cor-texto-secundario);
}
.marca-lc img { height: 56px; width: auto; opacity: 0.9; }

.form-admin label { display: block; font-size: 13px; margin-bottom: 12px; color: var(--cor-texto-secundario); }
.form-admin input[type="text"], .form-admin input[type="email"], .form-admin input[type="password"],
.form-admin input[type="date"], .form-admin select {
  width: 100%; margin-top: 5px; padding: 10px; border-radius: 2px; border: 1px solid var(--cor-linha);
  background: var(--cor-fundo); color: var(--cor-grafite); font-size: 14px; font-family: var(--fonte-corpo);
}
.form-admin input:focus, .form-admin select:focus { outline: none; border-color: var(--cor-bronze); }
.form-admin textarea {
  width: 100%; margin-top: 5px; padding: 10px; border-radius: 2px; border: 1px solid var(--cor-linha);
  background: var(--cor-fundo); color: var(--cor-grafite); font-size: 14px; font-family: var(--fonte-corpo);
  resize: vertical; min-height: 60px;
}
.form-admin .linha-checkbox { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 12px; color: var(--cor-texto-secundario); }
.form-admin .linha-checkbox input { width: auto; margin: 0; }
.erro-form { color: var(--cor-vermelho); font-size: 12px; margin-top: 6px; min-height: 16px; }

.tabela-usuarios { width: 100%; border-collapse: collapse; font-size: 13px; }
.tabela-usuarios th, .tabela-usuarios td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--cor-linha); vertical-align: top; }
.tabela-usuarios th { color: var(--cor-texto-secundario); font-weight: 500; font-size: 11px; text-transform: uppercase; letter-spacing: 0.03em; }
.tabela-usuarios .acoes-usuario { display: flex; gap: 8px; }
.tabela-usuarios .acoes-usuario button {
  background: none; border: none; color: var(--cor-vermelho); font-size: 12px; cursor: pointer; padding: 0;
  font-family: var(--fonte-corpo);
}

/* Home publica (2 botoes) */
.home-tela {
  min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 24px; gap: 16px;
}
.home-botoes { width: 100%; max-width: 340px; display: flex; flex-direction: column; gap: 12px; }
.home-botao {
  display: block; text-align: center; text-decoration: none; padding: 20px 16px; border-radius: 4px;
  font-family: var(--fonte-titulo); font-weight: 700; font-size: 16px; border: 1px solid var(--cor-linha);
}
.home-botao.ativo { background: var(--cor-vermelho); color: #fff; border-color: var(--cor-vermelho); }
.home-botao.ativo:hover { background: var(--cor-vermelho-escuro); }
.home-botao.desativado { background: var(--cor-branco); color: var(--cor-texto-secundario); cursor: not-allowed; }
.home-botao .sub-botao { display: block; font-family: var(--fonte-corpo); font-weight: 400; font-size: 12px; margin-top: 4px; }

/* LC Geral */
.secao-geral { margin-bottom: 18px; }
.secao-geral h2 { font-family: var(--fonte-titulo); font-size: 15px; margin: 0 0 10px; }
.aviso-mural { border-left: 3px solid var(--cor-bronze); padding-left: 12px; margin-bottom: 14px; }
.aviso-mural .titulo-aviso { font-weight: 600; font-size: 14px; }
.aviso-mural .texto-aviso { font-size: 13px; color: var(--cor-grafite); margin-top: 3px; white-space: pre-wrap; }
.aviso-mural .meta-aviso { font-size: 11px; color: var(--cor-texto-secundario); margin-top: 4px; font-family: var(--fonte-dado); }
.evento-agenda { display: flex; gap: 12px; align-items: baseline; margin-bottom: 10px; }
.evento-agenda .data-evento { font-family: var(--fonte-dado); font-size: 12px; color: var(--cor-bronze); flex-shrink: 0; white-space: nowrap; }
.evento-agenda .titulo-evento { font-size: 14px; }
.evento-agenda .descricao-evento { font-size: 12px; color: var(--cor-texto-secundario); }
.aniversariante { display: flex; justify-content: space-between; font-size: 13px; padding: 6px 0; border-bottom: 1px solid var(--cor-linha); }
.aniversariante:last-child { border-bottom: none; }
.aniversariante .dia-aniversario { font-family: var(--fonte-dado); color: var(--cor-bronze); }
.apps-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 10px; }
.apps-grid a {
  display: flex; flex-direction: column; align-items: center; gap: 6px; text-decoration: none; color: inherit;
  background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 4px; padding: 14px 8px; text-align: center;
}
.apps-grid a:hover { border-color: var(--cor-bronze); }
.apps-grid .icone-app { font-size: 26px; }
.apps-grid img.icone-app { width: 32px; height: 32px; object-fit: contain; }
.apps-grid .nome-app { font-size: 12px; font-weight: 600; }
.apps-grid .app-sem-acesso {
  display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center;
  background: var(--cor-fundo); border: 1px dashed var(--cor-linha); border-radius: 4px; padding: 14px 8px;
  color: var(--cor-texto-secundario); opacity: 0.55; cursor: not-allowed; filter: grayscale(1);
}

/* ==========================================================================
   NexuApp — filtros, cards de tarefa, badges de status/prioridade, dashboard
   ========================================================================== */
.barra-filtros {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px;
}
.barra-filtros select, .barra-filtros input {
  padding: 8px 10px; border-radius: 2px; border: 1px solid var(--cor-linha);
  background: var(--cor-branco); color: var(--cor-grafite); font-size: 13px; font-family: var(--fonte-corpo);
}
.toggle-minhas {
  display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--cor-texto-secundario);
  cursor: pointer; padding: 8px 10px; border: 1px solid var(--cor-linha); border-radius: 2px; background: var(--cor-branco);
}
.toggle-minhas input { margin: 0; }
.linha-toggles { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }

.quadro-colunas {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; align-items: start;
}
@media (max-width: 900px) { .quadro-colunas { grid-template-columns: 1fr; } }
.coluna-status {
  background: var(--cor-fundo); border: 1px solid var(--cor-linha); border-radius: 4px; padding: 10px; min-height: 60px;
  min-width: 0; /* sem isso, um titulo comprido sem quebra forcaria essa coluna mais larga que as outras */
}
.coluna-status-cabecalho {
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--fonte-titulo); font-weight: 700; font-size: 13px; padding: 4px 6px 10px;
}
.coluna-status-contagem {
  font-family: var(--fonte-dado); font-size: 12px; color: var(--cor-texto-secundario);
  background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 10px; padding: 1px 8px;
}
.coluna-status .card-tarefa { margin-bottom: 10px; }
.coluna-status-vazia { font-size: 12px; color: var(--cor-texto-secundario); padding: 6px; }

.btn-nova-tarefa {
  display: inline-block; text-decoration: none; background: var(--cor-vermelho); color: #fff;
  font-family: var(--fonte-corpo); font-weight: 600; font-size: 14px; padding: 10px 16px;
  border-radius: 2px; margin-bottom: 14px;
}
.btn-nova-tarefa:hover { background: var(--cor-vermelho-escuro); }

#listaTarefas .vazio { grid-column: 1 / -1; }

.card-tarefa {
  display: block; text-decoration: none; color: inherit;
  background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 4px;
  padding: 14px; margin-bottom: 0;
}
.card-tarefa:hover { border-color: var(--cor-bronze); }
.card-tarefa.atrasada { border-left: 3px solid var(--cor-vermelho); }
.card-tarefa .titulo-tarefa { font-family: var(--fonte-titulo); font-weight: 700; font-size: 15px; margin-bottom: 4px; overflow-wrap: break-word; }
.card-tarefa .meta-tarefa { font-size: 12px; color: var(--cor-texto-secundario); display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; }
.card-tarefa .meta-tarefa .prazo-atrasado { color: var(--cor-vermelho); font-weight: 600; }

.selo-status, .selo-prioridade {
  display: inline-block; font-size: 11px; padding: 2px 8px; border-radius: 2px; font-family: var(--fonte-dado);
}
.selo-status.a_fazer { background: #EEE; color: var(--cor-texto-secundario); }
.selo-status.em_andamento { background: #E3EEF9; color: #2E6DA4; }
.selo-status.aguardando { background: #FBF0DA; color: #A87A1E; }
.selo-status.concluida { background: #E4F3E7; color: #2E8B4E; }
.selo-status.atrasada { background: #FBE4E4; color: var(--cor-vermelho); }
.selo-prioridade.baixa { background: #EEE; color: var(--cor-texto-secundario); }
.selo-prioridade.normal { background: #F1E9E2; color: var(--cor-bronze); }
.selo-prioridade.alta { background: #FBF0DA; color: #A87A1E; }
.selo-prioridade.urgente { background: #FBE4E4; color: var(--cor-vermelho); }

.comentario { border-bottom: 1px solid var(--cor-linha); padding: 10px 0; }
.comentario .autor-comentario { font-size: 12px; font-weight: 600; }
.comentario .data-comentario { font-size: 11px; color: var(--cor-texto-secundario); font-family: var(--fonte-dado); }
.comentario .texto-comentario { font-size: 13px; margin-top: 3px; white-space: pre-wrap; }

.anexo-item { padding: 6px 0; font-size: 13px; border-bottom: 1px solid var(--cor-linha); }
.anexo-linha { display: flex; justify-content: space-between; align-items: center; }
.anexo-previa { display: block; max-width: 100%; max-height: 220px; border-radius: 4px; margin-bottom: 6px; }

.evento-historico { font-size: 12px; color: var(--cor-texto-secundario); padding: 5px 0; border-bottom: 1px solid var(--cor-linha); }
.evento-historico .campo-historico { font-family: var(--fonte-dado); color: var(--cor-grafite); }

/* Edição inline de título/descrição (lápis ao lado do valor, em vez de duplicar o campo) */
.linha-titulo-editavel { display: flex; align-items: center; gap: 8px; }
.btn-lapis {
  background: none; border: none; cursor: pointer; padding: 2px; font-size: 14px;
  opacity: 0.5; line-height: 1;
}
.btn-lapis:hover { opacity: 1; }
.bloco-edicao-inline { margin: 8px 0 14px; }
.bloco-edicao-inline .acoes { display: flex; gap: 8px; margin-top: 8px; }
.bloco-edicao-inline .acoes button { padding: 8px 14px; font-size: 13px; }

.tabela-dashboard { width: 100%; border-collapse: collapse; font-size: 13px; }
.tabela-dashboard th, .tabela-dashboard td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--cor-linha); }
.tabela-dashboard th { color: var(--cor-texto-secundario); font-weight: 500; font-size: 11px; text-transform: uppercase; letter-spacing: 0.03em; }

.abas { display: flex; gap: 4px; margin-bottom: 14px; border-bottom: 1px solid var(--cor-linha); }
.abas a { padding: 10px 14px; text-decoration: none; color: var(--cor-texto-secundario); font-size: 13px; font-weight: 600; border-bottom: 2px solid transparent; }
.abas a.ativa { color: var(--cor-vermelho); border-bottom-color: var(--cor-vermelho); }

/* ==========================================================================
   Barra lateral de Empreendimentos (navegacao estilo "pastas", so pra interno)
   ========================================================================== */
/* App e' desktop-only (confirmado pelo usuario) — sem limitar a largura maxima, a barra lateral
   cola na esquerda e o conteudo aproveita o resto da tela. */
.layout-com-sidebar { display: flex; gap: 20px; align-items: flex-start; padding: 0 24px; }
.layout-com-sidebar .container.largo { max-width: none; margin: 0; padding: 20px 0 40px; flex: 1; min-width: 0; }
.sidebar-projetos { width: 260px; flex-shrink: 0; margin-top: 20px; background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 4px; padding: 12px; position: sticky; top: 70px; max-height: calc(100vh - 90px); overflow-y: auto; }
.sidebar-projetos:empty { display: none; }
.sidebar-cabecalho { display: flex; align-items: center; justify-content: space-between; padding: 0 8px; margin-bottom: 8px; }
.sidebar-titulo { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--cor-texto-secundario); }
.btn-novo-projeto-sidebar { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; border: 1px solid var(--cor-linha); border-radius: 2px; background: var(--cor-branco); color: var(--cor-bronze); cursor: pointer; }
.btn-novo-projeto-sidebar:hover { background: var(--cor-fundo); border-color: var(--cor-bronze); }
.linha-sidebar-projeto { display: flex; align-items: center; gap: 2px; }
.chevron-sidebar { flex-shrink: 0; width: 18px; height: 28px; border: none; background: none; color: var(--cor-texto-secundario); font-size: 10px; cursor: pointer; padding: 0; }
.chevron-sidebar:hover { color: var(--cor-grafite); }
.item-sidebar-projeto { flex: 1; display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 2px; color: var(--cor-grafite); text-decoration: none; font-size: 13px; overflow: hidden; min-width: 0; }
.item-sidebar-projeto span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.item-sidebar-projeto:hover { background: var(--cor-fundo); }
.item-sidebar-projeto.ativo { background: var(--cor-vermelho); color: #fff; }
.subarvore-sidebar { padding-left: 24px; margin-bottom: 2px; }
.subarvore-sidebar .item-sidebar-pasta { font-size: 12px; padding: 5px 8px; }
.subarvore-carregando, .subarvore-vazia { font-size: 12px; color: var(--cor-texto-secundario); padding: 4px 8px; }
@media (max-width: 860px) {
  .layout-com-sidebar { flex-direction: column; }
  .sidebar-projetos { width: 100%; position: static; max-height: 220px; margin-top: 12px; }
}

/* Modal generico (usado hoje so pelo "Novo projeto") — primeiro modal deste app, sem padrao
   pra reaproveitar de nenhum app irmao da LC ainda. */
.overlay-modal { position: fixed; inset: 0; background: rgba(46,49,53,.45); z-index: 20; display: flex; align-items: center; justify-content: center; padding: 20px; }
.modal-conteudo { width: 100%; max-width: 420px; margin: 0; }

/* ==========================================================================
   Checklist Início de Obra — modelo padrão + instância por obra
   ========================================================================== */
.checklist-progresso-geral {
  display: flex; align-items: center; gap: 12px; margin-bottom: 18px;
  font-size: 13px; color: var(--cor-texto-secundario); font-family: var(--fonte-dado);
}
.checklist-progresso-barra {
  flex: 1 1 auto; height: 8px; background: var(--cor-linha); border-radius: 4px; overflow: hidden;
}
.checklist-progresso-preenchido { height: 100%; background: #2E8B4E; }

.checklist-fase { margin-bottom: 22px; }
.checklist-fase-cabecalho {
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--fonte-titulo); font-weight: 700; font-size: 14px;
  padding: 6px 0; border-bottom: 1px solid var(--cor-linha); margin-bottom: 8px;
}
.checklist-fase-contagem {
  font-family: var(--fonte-dado); font-size: 12px; color: var(--cor-texto-secundario);
  background: var(--cor-fundo); border: 1px solid var(--cor-linha); border-radius: 10px; padding: 1px 8px;
}

.checklist-fase-gestor {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  font-size: 12px; color: var(--cor-texto-secundario); margin-bottom: 10px;
}
.checklist-fase-gestor .link-editar-gestor {
  background: none; border: none; color: var(--cor-vermelho); cursor: pointer;
  font-family: var(--fonte-corpo); font-size: 12px; padding: 0;
}
.checklist-fase-gestor-editando {
  display: block; background: var(--cor-fundo); border: 1px solid var(--cor-linha);
  border-radius: 4px; padding: 12px; margin-bottom: 10px;
}
.busca-usuarios {
  width: 100%; padding: 8px 10px; border-radius: 2px; border: 1px solid var(--cor-linha);
  background: var(--cor-branco); color: var(--cor-grafite); font-size: 13px; font-family: var(--fonte-corpo);
  margin-bottom: 6px;
}
.busca-usuarios:focus { outline: none; border-color: var(--cor-bronze); }
.lista-checkbox-usuarios {
  max-height: 200px; overflow-y: auto; border: 1px solid var(--cor-linha); border-radius: 4px;
  padding: 4px 10px; background: var(--cor-branco); margin-bottom: 12px;
}
.lista-checkbox-usuarios .linha-checkbox { margin-bottom: 0; padding: 5px 0; border-bottom: 1px solid var(--cor-fundo); }
.lista-checkbox-usuarios .linha-checkbox:last-child { border-bottom: none; }

.checklist-item-linha {
  display: grid; grid-template-columns: 2.2fr 0.9fr 1.3fr 1fr 1.4fr auto;
  gap: 8px; align-items: center; padding: 8px 6px; border-bottom: 1px solid var(--cor-linha);
}
.checklist-item-linha.atrasado { background: #FBE4E4; }
.checklist-item-nome { min-width: 0; }
.checklist-item-categoria {
  display: block; font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--cor-texto-secundario); margin-bottom: 2px;
}
.checklist-item-linha select, .checklist-item-linha input {
  padding: 6px 8px; border-radius: 2px; border: 1px solid var(--cor-linha);
  background: var(--cor-branco); color: var(--cor-grafite); font-size: 12px; font-family: var(--fonte-corpo);
  min-width: 0; width: 100%;
}
.checklist-item-status.status-ok { background: #E4F3E7; color: #2E8B4E; border-color: #C7E4CD; font-weight: 600; }
.checklist-item-status.status-pendente { background: #EEE; color: var(--cor-texto-secundario); }
.checklist-item-status.status-nao_aplica { background: #F1E9E2; color: var(--cor-bronze); }
.checklist-item-status.status-parado { background: #FBE4E4; color: var(--cor-vermelho); font-weight: 600; }
.checklist-item-atrasado-selo {
  font-size: 10px; font-weight: 600; color: var(--cor-vermelho); white-space: nowrap;
  font-family: var(--fonte-dado); text-transform: uppercase;
}
@media (max-width: 900px) {
  .checklist-item-linha { grid-template-columns: 1fr; }
}

#tabelaModeloChecklist input[type="text"] {
  padding: 6px 8px; border-radius: 2px; border: 1px solid var(--cor-linha);
  background: var(--cor-branco); color: var(--cor-grafite); font-size: 12px; font-family: var(--fonte-corpo); width: 100%;
}
#tabelaModeloChecklist input[type="text"]:focus { outline: none; border-color: var(--cor-bronze); }
#tabelaModeloChecklist td { vertical-align: middle; }

/* ==========================================================================
   Acompanhamento (Medição Gerencial / Cronograma) — grade tipo "quadro de presença"
   ========================================================================== */
.legenda-calendario { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 12px; color: var(--cor-texto-secundario); }
.legenda-item { display: flex; align-items: center; gap: 6px; }
.legenda-cor { width: 12px; height: 12px; border-radius: 3px; display: inline-block; border: 1px solid var(--cor-linha); flex-shrink: 0; }

.tabela-acompanhamento { border-collapse: collapse; width: 100%; font-size: 12px; }
.tabela-acompanhamento th, .tabela-acompanhamento td {
  padding: 6px 8px; text-align: center; border-bottom: 1px solid var(--cor-linha); white-space: nowrap;
}
.tabela-acompanhamento th { font-family: var(--fonte-titulo); font-weight: 700; color: var(--cor-texto-secundario); font-size: 11px; }
.tabela-acompanhamento td:first-child, .tabela-acompanhamento th:first-child { white-space: normal; min-width: 180px; }

.celula-acompanhamento {
  width: 26px; height: 26px; border-radius: 4px; border: none; cursor: pointer; padding: 0;
  transition: transform 0.1s;
}

/* ==========================================================================
   Portal de Projetos LC — status colorido (seção 8 do estudo), login duplo, cronograma,
   revisões de documento
   ========================================================================== */
.selo-cor {
  display: inline-block; font-size: 11px; padding: 2px 8px; border-radius: 2px;
  font-family: var(--fonte-dado); font-weight: 600; white-space: nowrap;
}
.selo-cor.verde { background: #E4F3E7; color: #2E8B4E; }
.selo-cor.amarelo { background: #FBF0DA; color: #A87A1E; }
.selo-cor.vermelho { background: #FBE4E4; color: var(--cor-vermelho); }
.selo-cor.azul { background: #E3EEF9; color: #2E6DA4; }
.selo-cor.roxo { background: #EDE3F5; color: #6A3FA0; }
.selo-cor.preto { background: #E8E8E8; color: var(--cor-grafite); }

/* Botoes pequenos de acao dentro de uma linha de pasta (mover pra cima/baixo, excluir fase) —
   sem borda, sem fundo, so o icone/simbolo, discretos ate passar o mouse. */
.link-mover-pasta, .link-excluir-pasta {
  border: none; background: none; padding: 2px 5px; cursor: pointer;
  color: var(--cor-texto-secundario); font-size: 10px; border-radius: 2px; line-height: 1;
}
.link-mover-pasta:hover, .link-excluir-pasta:hover { background: var(--cor-fundo); color: var(--cor-grafite); }
.link-mover-pasta:disabled { opacity: .25; cursor: default; }
.link-mover-pasta:disabled:hover { background: none; color: var(--cor-texto-secundario); }
.link-excluir-pasta { font-size: 14px; }

.tela-login-dupla {
  min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px;
}
.card-login { background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 4px; padding: 28px; width: 100%; max-width: 380px; }
.card-login h1 { font-family: var(--fonte-titulo); font-size: 18px; margin: 0 0 4px; text-align: center; }
.card-login .subtitulo-login { text-align: center; color: var(--cor-texto-secundario); font-size: 12px; margin-bottom: 20px; }
.divisor-login { display: flex; align-items: center; gap: 10px; margin: 18px 0; color: var(--cor-texto-secundario); font-size: 11px; text-transform: uppercase; }
.divisor-login::before, .divisor-login::after { content: ''; flex: 1; height: 1px; background: var(--cor-linha); }
.btn-sso-interno {
  display: block; width: 100%; text-align: center; text-decoration: none; padding: 12px;
  border: 1px solid var(--cor-linha); border-radius: 2px; color: var(--cor-grafite);
  font-family: var(--fonte-corpo); font-size: 14px; font-weight: 600;
}
.btn-sso-interno:hover { border-color: var(--cor-bronze); }

.tabela-cronograma { width: 100%; border-collapse: collapse; font-size: 13px; }
.tabela-cronograma th, .tabela-cronograma td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--cor-linha); }
.tabela-cronograma th { color: var(--cor-texto-secundario); font-weight: 500; font-size: 11px; text-transform: uppercase; letter-spacing: 0.03em; }
.tabela-cronograma tr.atrasada-linha { background: #FFF8F8; }

/* Arvore de pastas com expansao inline (documentos.html) — chevron por linha (fase/formato/
   Documentos), acoes de texto discretas (Nova revisao/Ver detalhes) e nome de documento
   clicavel pra renomear. */
.chevron-linha { width: 16px; flex-shrink: 0; border: none; background: none; color: var(--cor-texto-secundario); font-size: 10px; cursor: pointer; padding: 0; margin-right: 4px; }
.chevron-linha:hover { color: var(--cor-grafite); }
.link-inline-acao { border: none; background: none; padding: 0; margin-right: 12px; color: var(--cor-bronze); font-size: 12px; cursor: pointer; font-family: var(--fonte-corpo); }
.link-inline-acao:hover { text-decoration: underline; }
.nome-documento-editavel { cursor: pointer; }
.nome-documento-editavel:hover { text-decoration: underline; }

/* Diretrizes de projeto (public/diretrizes.html) e Analise de Atendimento — botoes de status
   estilo "pill", igual ao resto do app usa pra selo de status, so' que clicaveis. */
.btn-status-diretriz { font-family: var(--fonte-corpo); font-size: 12px; padding: 5px 12px; border-radius: 20px; border: 1px solid var(--cor-linha); background: var(--cor-branco); cursor: pointer; color: var(--cor-texto-secundario); }
.btn-status-diretriz:hover { border-color: var(--cor-bronze); }
.btn-status-diretriz.ativo-obrigatorio { background: var(--cor-vermelho); border-color: var(--cor-vermelho); color: #fff; }
.btn-status-diretriz.ativo-nao_aplicavel { background: var(--cor-texto-secundario); border-color: var(--cor-texto-secundario); color: #fff; }
.btn-status-revisao { font-family: var(--fonte-corpo); font-size: 12px; padding: 5px 11px; border-radius: 20px; border: 1px solid var(--cor-linha); background: var(--cor-branco); cursor: pointer; color: var(--cor-texto-secundario); margin: 2px 4px 2px 0; }
.btn-status-revisao:hover { border-color: var(--cor-bronze); }
/* slug ASCII (ver CLASSE_STATUS_REVISAO em analise-atendimento.html) — evita classe CSS com
   espaco/acento, que precisaria de escape. */
.btn-status-revisao.ativo-atende { background: #E4F3E7; border-color: #2E8B4E; color: #2E8B4E; }
.btn-status-revisao.ativo-atende_parcial { background: #FBF0DA; border-color: #A87A1E; color: #A87A1E; }
.btn-status-revisao.ativo-nao_atende { background: #FBE4E4; border-color: var(--cor-vermelho); color: var(--cor-vermelho); }
.btn-status-revisao.ativo-nao_aplica, .btn-status-revisao.ativo-pendente { background: var(--cor-texto-secundario); border-color: var(--cor-texto-secundario); color: #fff; }

.linha-revisao {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 10px 0; border-bottom: 1px solid var(--cor-linha);
}
.linha-revisao:last-child { border-bottom: none; }
.linha-revisao .numero-revisao { font-family: var(--fonte-dado); font-weight: 700; color: var(--cor-bronze); min-width: 36px; }
.linha-revisao .meta-revisao { font-size: 12px; color: var(--cor-texto-secundario); }

.grid-indicadores { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 18px; }
.card-indicador { background: var(--cor-branco); border: 1px solid var(--cor-linha); border-radius: 4px; padding: 14px; }
.card-indicador .numero-indicador { font-family: var(--fonte-titulo); font-weight: 800; font-size: 26px; }
.card-indicador .rotulo-indicador { font-size: 12px; color: var(--cor-texto-secundario); }
.celula-acompanhamento:hover { transform: scale(1.15); }
