/* ══════════════════════════════════════════════════════════════
   FINANÇAS — Shell do app: menu lateral, conteúdo, barra inferior
   ══════════════════════════════════════════════════════════════ */
.nav {
  width: 248px; position: fixed; top: 0; bottom: 0; left: 0; z-index: 40;
  background: var(--nav-bg); color: var(--nav-txt);
  display: flex; flex-direction: column; transition: transform .25s ease;
}
.nav-logo { display: flex; align-items: center; gap: 12px; padding: 22px 20px 20px; border-bottom: 1px solid var(--nav-borda); }
.logo-marca {
  width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0;
  background: linear-gradient(145deg, #C9A86A, #A9864E); color: #14382A;
  font-family: var(--serif); font-size: 21px; font-weight: 600; box-shadow: 0 6px 16px rgba(0,0,0,.25);
}
.logo-nome { font-family: var(--serif); font-size: 19px; font-weight: 600; letter-spacing: .01em; line-height: 1.1; }
.logo-sub  { font-size: 10px; color: var(--nav-txt2); letter-spacing: .16em; text-transform: uppercase; margin-top: 3px; }

/* Seletor de espaço */
.nav-espaco {
  margin: 16px 14px 4px; padding: 10px 12px; border-radius: 12px; width: calc(100% - 28px);
  background: var(--nav-hover); border: 1px solid var(--nav-borda); color: var(--nav-txt);
  display: flex; align-items: center; gap: 10px; text-align: left;
}
.nav-espaco.trocavel { cursor: pointer; }
.nav-espaco.trocavel:hover { border-color: rgba(201,168,106,.35); }
.nav-espaco .lbl { font-size: 10px; color: var(--nav-txt2); letter-spacing: .1em; text-transform: uppercase; }
.nav-espaco .nome { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 150px; }
.nav-espaco .seta { margin-left: auto; color: var(--nav-txt2); }

.nav-scroll { flex: 1; overflow-y: auto; padding-bottom: 12px; scrollbar-width: none; }
.nav-scroll::-webkit-scrollbar { display: none; }
.nav-secao { padding: 18px 22px 6px; font-size: 9.5px; font-weight: 700; color: var(--nav-txt2); letter-spacing: .16em; text-transform: uppercase; opacity: .8; }
.nav-item {
  display: flex; align-items: center; gap: 12px; padding: 9px 14px; margin: 1px 12px;
  border-radius: 10px; cursor: pointer; color: var(--nav-txt); font-size: 13.5px; font-weight: 500;
  transition: background .15s, color .15s; position: relative; text-decoration: none;
}
.nav-item svg.i { color: var(--nav-txt2); }
.nav-item:hover { background: var(--nav-hover); }
.nav-item.ativo { background: var(--nav-ativo); color: #F3E6C8; }
.nav-item.ativo svg.i { color: #C9A86A; }
.nav-item.ativo::before { content: ''; position: absolute; left: -12px; top: 9px; bottom: 9px; width: 3px; border-radius: 0 3px 3px 0; background: #C9A86A; }
.nav-item.em-breve { opacity: .5; cursor: default; }
.nav-item.em-breve:hover { background: none; }
.nav-item { white-space: nowrap; }
.nav-item .badge { margin-left: auto; font-size: 8.5px; font-weight: 700; padding: 1px 6px; border-radius: 20px; background: rgba(233,223,204,.1); color: var(--nav-txt2); letter-spacing: .06em; text-transform: uppercase; flex-shrink: 0; }

.nav-rodape { padding: 12px; border-top: 1px solid var(--nav-borda); }
.nav-usuario { display: flex; align-items: center; gap: 10px; padding: 6px; border-radius: 12px; }
.nav-usuario .info { min-width: 0; flex: 1; }
.nav-usuario .nome { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-usuario .perfil { font-size: 11px; color: var(--nav-txt2); }
.nav-btn { width: 30px; height: 30px; border: none; background: none; border-radius: 9px; color: var(--nav-txt2); display: grid; place-items: center; cursor: pointer; }
.nav-btn:hover { background: var(--nav-hover); color: var(--nav-txt); }

/* Conteúdo */
.main { margin-left: 248px; padding: 34px 36px 64px; min-height: 100vh; }
.pagina { animation: surgir .2s ease; }
.topo { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 20px; margin-bottom: 26px; flex-wrap: wrap; }
.topo-esq { display: flex; gap: 12px; align-items: flex-end; min-width: 0; }
.sobretitulo { font-size: 12.5px; color: var(--txt2); letter-spacing: .02em; margin-bottom: 4px; }
.topo-acoes { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

.carregando { display: flex; justify-content: center; padding: 80px 0; }

/* Abas */
.abas { display: inline-flex; gap: 4px; padding: 4px; border-radius: 13px; background: var(--card2); border: 1px solid var(--border); margin-bottom: 18px; }
.aba { height: 34px; padding: 0 16px; border: none; background: none; border-radius: 10px; font-weight: 600; font-size: 13px; color: var(--txt2); cursor: pointer; }
.aba.ativa { background: var(--card); color: var(--txt); box-shadow: var(--sombra); }

/* KPIs */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; margin-bottom: 18px; }
.kpis > *, .grade > * { min-width: 0; }
.kpi { padding: 18px 20px; }
.kpi .rot { font-size: 12px; font-weight: 600; color: var(--txt2); }
.kpi .val { font-family: var(--serif); font-size: 28px; font-weight: 500; margin-top: 6px; }

/* Boas-vindas do painel */
.boas-vindas {
  position: relative; overflow: hidden; padding: 30px 32px; border-radius: 20px; margin-bottom: 18px;
  background: linear-gradient(150deg, #14382A 0%, #1F4D3A 60%, #2C5E47 100%); color: #F3E6C8;
}
.boas-vindas::after { content: ''; position: absolute; right: -60px; top: -60px; width: 240px; height: 240px; border-radius: 50%; border: 1px solid rgba(201,168,106,.25); box-shadow: 0 0 0 30px rgba(201,168,106,.05), 0 0 0 60px rgba(201,168,106,.03); }
.boas-vindas h2 { font-size: 26px; margin-bottom: 6px; }
.boas-vindas p { color: #C8D4C2; max-width: 560px; }
.roteiro { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.etapa { padding: 18px; display: flex; gap: 14px; align-items: flex-start; }
.etapa .ic { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; background: var(--sage-soft); color: var(--brand-2); flex-shrink: 0; }
.etapa .t { font-weight: 600; margin-bottom: 2px; }
.etapa .d { font-size: 12.5px; color: var(--txt2); }
.etapa.feita .ic { background: var(--gold-soft); color: var(--gold-forte); }

/* Grade de duas colunas */
.grade-2 { display: grid; grid-template-columns: 1.4fr 1fr; gap: 16px; align-items: start; }
.grade-2.iguais { grid-template-columns: 1fr 1fr; }
.grade-2 > * { min-width: 0; }
@media (max-width: 980px) { .grade-2, .grade-2.iguais { grid-template-columns: 1fr; } }

/* Lista de membros / pessoas */
.pessoa { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.pessoa:last-child { border-bottom: none; }
.pessoa .nome { font-weight: 600; }
.pessoa .sub { font-size: 12px; color: var(--txt2); }
.pessoa .dir { margin-left: auto; display: flex; align-items: center; gap: 8px; }

.espacos-lista { display: flex; flex-wrap: wrap; gap: 5px; }

/* Busca */
.busca { position: relative; min-width: 240px; }
.busca svg.i { position: absolute; left: 12px; top: 11px; color: var(--txt3); }
.busca .entrada { padding-left: 38px; height: 40px; }

/* Tela de troca de senha obrigatória */
.tela-centro { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.cartao-centro { width: 100%; max-width: 440px; padding: 30px; }

/* Mobile */
.nav-toggle { display: none; }
.barra-inferior { display: none; }
.overlay { display: none; }
@media (max-width: 860px) {
  .nav { transform: translateX(-100%); }
  body.menu-aberto .nav { transform: none; box-shadow: 0 0 60px rgba(0,0,0,.4); }
  body.menu-aberto .overlay { display: block; position: fixed; inset: 0; z-index: 39; background: rgba(10,20,15,.5); backdrop-filter: blur(2px); }
  .main { margin-left: 0; padding: 18px 16px 104px; padding-top: max(18px, env(safe-area-inset-top)); }
  .nav-toggle { display: inline-flex; }
  h1 { font-size: 25px; }
  .topo-acoes .btn-txt { display: none; }
  .busca { min-width: 0; flex: 1; }
  .barra-inferior {
    display: flex; position: fixed; left: 12px; right: 12px; z-index: 30; height: 64px;
    bottom: max(12px, env(safe-area-inset-bottom));
    background: var(--nav-bg); border-radius: 20px; box-shadow: 0 10px 30px rgba(10,20,15,.35);
    justify-content: space-around; align-items: center; padding: 0 6px;
  }
  .barra-inferior a { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 10px; color: var(--nav-txt2); flex: 1; }
  .barra-inferior a.ativo { color: var(--dourado-claro); }
  .barra-inferior .mais { width: 50px; height: 50px; flex: none; border-radius: 16px; background: linear-gradient(145deg, #C9A86A, #A9864E); color: #14382A; display: grid; place-items: center; margin-top: -26px; box-shadow: 0 8px 20px rgba(169,134,78,.45); }
  .barra-inferior .mais svg.i { width: 24px; height: 24px; stroke-width: 2.2; }
  .barra-inferior .mais.desabilitado { opacity: .55; }
  .boas-vindas { padding: 24px 22px; }

  /* Tabelas viram cartões empilhados */
  .tabela.responsiva thead { display: none; }
  .tabela.responsiva tr { display: block; padding: 12px 0; border-bottom: 1px solid var(--border); }
  .tabela.responsiva tr:last-child { border-bottom: none; }
  .tabela.responsiva td { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; border: none; text-align: right; }
  .tabela.responsiva td::before { content: attr(data-rot); font-size: 11.5px; color: var(--txt3); font-weight: 600; text-align: left; }
  .tabela.responsiva td.principal { display: block; text-align: left; padding-bottom: 6px; }
  .tabela.responsiva td.principal::before { display: none; }
  .tabela.responsiva td.acoes { justify-content: flex-end; padding-top: 8px; }
  .tabela.responsiva td.acoes::before { display: none; }
  .tabela.responsiva tbody tr:hover td { background: none; }
}
@media (max-width: 560px) {
  .kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kpis > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  .kpi { padding: 14px; }
  .kpi .rot { font-size: 11px; line-height: 1.3; }
  .kpi .val { font-size: 22px; }
  .busca { flex-basis: 100%; }
}