/* ==========================================================================
   M2DF — Manual de Marca v1.1 · camada de marca do Portal M2DF
   Carregar DEPOIS do <style> de cada página. Não altera lógica nem estrutura.
   Paleta: Marinho 2C4560 · Papel F0EFEB · Grafite 1D2733 · Ardósia 5D6773
           Aço 44658A · Névoa 9CC3D0 · Pedra E2E4E1 · Taupe 8F8676 · Fio CCD3D2
   Regras: sem cantos arredondados, sem sombras, sem vermelho/verde.
   ========================================================================== */
html:root{
  --marinho:#2C4560; --papel:#F0EFEB; --grafite:#1D2733; --ardosia:#5D6773;
  --aco:#44658A; --nevoa:#9CC3D0; --pedra:#E2E4E1; --taupe:#8F8676;
  --fio:#CCD3D2; --neutro:#B9C7CE; --ameixa:#481F67;

  /* remapeia as variáveis legadas das páginas */
  --preto:var(--marinho); --navy:var(--marinho); --ice:var(--nevoa);
  --ink:var(--grafite); --ink-2:var(--ardosia); --ink-3:var(--ardosia);
  --line:var(--fio); --line-2:var(--neutro);
  --bg:var(--papel); --card:var(--pedra);
  --warn-bg:var(--pedra); --warn-ink:var(--grafite);
  --danger:var(--grafite); --danger-bg:var(--pedra);
  --ok-bg:var(--nevoa); --ok-ink:var(--marinho);
  --azul-bg:var(--nevoa); --azul-ink:var(--marinho);
  --g-concl:var(--marinho); --g-rec:var(--aco); --g-nao:var(--fio);
  --sans:"Archivo",Arial,Helvetica,sans-serif;
  --serif:"Archivo",Arial,Helvetica,sans-serif;
  --mono:"JetBrains Mono",Consolas,"Courier New",monospace;
}
*,*::before,*::after{border-radius:0 !important;box-shadow:none !important;text-shadow:none !important}
html{-webkit-font-smoothing:antialiased}
body{background:var(--papel);color:var(--grafite);font-family:var(--sans);font-size:16px;line-height:26px}
a{text-underline-offset:3px}
:focus-visible{outline:2px solid var(--aco);outline-offset:2px}

/* ---- tipografia ---- */
h1{font-family:var(--sans);font-weight:700;font-size:40px;line-height:48px;letter-spacing:-.01em;color:var(--marinho);margin:0 0 8px}
h2{font-family:var(--sans);font-weight:600;font-size:28px;line-height:36px;color:var(--marinho)}
h3{font-family:var(--sans);font-weight:600;font-size:20px;line-height:28px;color:var(--marinho)}
.secao h2,.registro h2{font-size:28px;line-height:36px;font-weight:600;color:var(--marinho)}
.grupo-cab h3,.modal h3{font-family:var(--sans);font-weight:600;font-size:20px;line-height:28px;color:var(--marinho)}
.sub,.secao .desc,.registro .desc,.desc{font-size:14px;line-height:22px;color:var(--ardosia)}
.prose{font-family:var(--sans);font-size:16px;line-height:26px}
.eyebrow,.sub,.contagem{color:var(--ardosia)}
.eyebrow,.rotulo,.rot,.kpi-label,.r,.idx-rot,.cal-cab,.campo label,.modal label,
.grupo-filtro .rotulo,.fgrp .rotulo,.visoes .rot,th,.tag,.selo,.card-classe,.card-resp,
.contagem,.hist-periodo small,.src,.note,.legenda-grafico,.rodape-layout,.mono{
  font-family:var(--mono);text-transform:uppercase;letter-spacing:.1em;font-weight:500}
.eyebrow,.rotulo,.rot,.kpi-label,.r,.idx-rot,.cal-cab,.campo label,.modal label{font-size:11px;line-height:16px;color:var(--ardosia)}
.src,.note,.legenda-grafico,.contagem{font-size:11px;line-height:18px;color:var(--ardosia)}
.tabnum,td,.n,.q-pct,.kpi-valor,.ct{font-variant-numeric:tabular-nums}

/* ---- header ---- */
.topbar{background:var(--marinho);color:var(--papel);padding:0;min-height:72px;display:flex;align-items:center}
.topbar .wrap{width:100%;min-height:72px;flex-wrap:wrap;gap:12px 24px;align-items:center}
.marca{min-height:32px;gap:16px}
.marca img{height:32px !important;width:auto}
.marca .texto{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--papel)}
.links-topo a,.link-topo,.btn-topo{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  color:var(--papel);background:transparent;border:1px solid var(--nevoa);padding:0 16px;min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
.links-topo a:hover,.link-topo:hover,.btn-topo:hover{background:var(--aco);border-color:var(--papel)}
.links-topo a.atual,.btn-topo.ativo{background:var(--papel);color:var(--marinho);border-color:var(--papel)}
#seletorFundo{font-family:var(--sans);font-size:14px;min-height:44px;padding:0 12px;border:1px solid var(--nevoa);background:var(--marinho);color:var(--papel)}
#seletorFundo option{background:var(--papel);color:var(--grafite)}
.topbar-dir{gap:12px}

/* ---- grade 12 col · máx. 1200 · margens 80/40/20 ---- */
.wrap{max-width:1200px;padding:0 80px}
@media (max-width:1023px){.wrap{padding:0 40px}}
@media (max-width:639px){.wrap{padding:0 20px}}
main{padding:48px 0 96px}
main.wrap{padding-top:48px;padding-bottom:96px}
@media (min-width:1180px){
  .topbar .wrap,main.layout{max-width:1200px}
  main.layout{grid-template-columns:200px minmax(0,1fr);gap:48px}
  .prose,.att .fact,.att .imp{max-width:72ch}
}
@media (max-width:639px){h1{font-size:28px;line-height:36px}h2,.secao h2{font-size:22px;line-height:30px}}

/* ---- botões (quadrados, 44px) ---- */
button.acao,.btn-preto,.btn-salvar,.b-salvar,.form-rodape button,#loginArea button,#capaLogin button,.capa button,
.modal-acoes button,.barra-edicao button,.btn-cancelar,.b-cancelar,.b-excluir{
  font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  min-height:44px;padding:0 24px;border:1px solid var(--marinho);cursor:pointer}
button.acao,.btn-preto,.btn-salvar,.b-salvar,.form-rodape button,#loginArea button,#capaLogin button{background:var(--marinho);color:var(--papel)}
button.acao:hover,.btn-preto:hover,.btn-salvar:hover,.b-salvar:hover,.form-rodape button:hover,#loginArea button:hover,#capaLogin button:hover{background:var(--aco);border-color:var(--aco)}
.btn-cancelar,.b-cancelar,.b-excluir{background:transparent;color:var(--marinho)}
.btn-cancelar:hover,.b-cancelar:hover,.b-excluir:hover{background:var(--pedra)}
.b-excluir{border-color:var(--grafite);color:var(--grafite)}
.form-rodape button:disabled{background:var(--fio);border-color:var(--fio);color:var(--ardosia)}
.more,.limpar,.mais-itens summary,.modal .link-fundo{color:var(--aco);font-family:var(--sans);border-bottom:1px solid var(--nevoa)}
.mais-itens summary{border-bottom:none;text-decoration:underline;text-underline-offset:3px}

/* ---- campos ---- */
#busca,.busca,.campo input,.campo select,.modal input,.modal select,textarea,.fsel,.campo-edicao{
  font-family:var(--sans);font-size:16px;min-height:44px;padding:0 14px;border:1px solid var(--neutro);
  background:var(--papel);color:var(--grafite)}
textarea,.campo-edicao{padding:10px 14px;min-height:78px;line-height:24px}
#busca:focus,.busca:focus,.campo input:focus,.campo select:focus,textarea:focus{outline:none;border-color:var(--marinho);box-shadow:inset 0 0 0 1px var(--marinho) !important}
.fsel.ativo{border-color:var(--marinho);color:var(--marinho)}
.campo-edicao{border-color:var(--marinho);background:var(--papel)}
.busca{max-width:420px}

/* ---- filtros / abas ---- */
.filtro,.visoes button,.troca-grafico button{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  min-height:36px;padding:0 14px;border:1px solid var(--neutro);background:transparent;color:var(--ardosia);display:inline-flex;align-items:center}
.filtro:hover,.visoes button:hover,.troca-grafico button:hover{border-color:var(--marinho);color:var(--marinho)}
.filtro.ativo,.visoes button.ativa,.troca-grafico button.ativo{background:var(--marinho);color:var(--papel);border-color:var(--marinho)}
.filtro.mais{color:var(--ardosia)}
.troca-grafico{border:1px solid var(--neutro)}
.troca-grafico button{border:none}
.filtros-barra{border-color:var(--fio)}
.grupo-filtro .rotulo,.fgrp .rotulo{margin-bottom:8px}

/* ---- cards (Pedra + barra Taupe) ---- */
.card,.caixa,.qcard,.registro,.cal,.kpi-card,.resumo .caixa,.modal{background:var(--pedra);border:1px solid var(--pedra);border-top:3px solid var(--taupe);transition:none}
.card{padding:24px}
.card:hover,.caixa:hover{background:var(--fio);border-color:var(--fio);border-top-color:var(--marinho)}
.card-nome{font-family:var(--sans);font-size:20px;line-height:28px;font-weight:600;letter-spacing:0;color:var(--marinho)}
.card-gestora{font-size:14px;color:var(--ardosia)}
.card-classe{background:transparent;border:1px solid var(--taupe);color:var(--grafite);padding:1px 8px;font-size:10.5px}
.card-resp{color:var(--ardosia);font-size:10.5px}
.caixa.ativa{border-color:var(--marinho);border-top-color:var(--marinho);background:var(--papel);box-shadow:none !important}
.caixa.alerta{background:var(--pedra);border-color:var(--grafite);border-top:3px solid var(--grafite)}
.caixa.alerta.ativa{background:var(--papel);border-color:var(--grafite)}
.caixa .n,.resumo .n{font-family:var(--sans);font-size:32px;line-height:40px;font-weight:700;color:var(--marinho)}
.caixa.alerta .n,.resumo .n.vermelho{color:var(--grafite);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.caixa .p{color:var(--ardosia)}
.kpi-card{padding:16px 20px}
.kpi-card.alerta{background:var(--pedra);border-top-color:var(--grafite)}
.kpi-valor{font-family:var(--sans);font-size:28px;line-height:36px;font-weight:700;color:var(--marinho)}
.kpi-valor.neg{color:var(--grafite)}
.kpi-sub{color:var(--ardosia)}
.qcard{padding:24px}
.q-nome{font-family:var(--sans);font-weight:600;font-size:20px;line-height:28px;color:var(--marinho)}
.q-pct{font-family:var(--mono);font-weight:500;font-size:22px;color:var(--marinho)}
.q-pct small{font-family:var(--mono);color:var(--ardosia);font-size:11px}
.barra{height:12px;background:var(--fio)}.barra.fina{height:8px}
.seg.c{background:var(--marinho)}.seg.r{background:var(--aco)}.seg.n{background:var(--fio)}
.seg:hover{filter:none;opacity:.85}
.q-leg i,.legenda i,.cal-legenda i{border-radius:0}
.q-leg .atr,.q-leg .atr b{color:var(--grafite);font-weight:700}
.q-an{border-top-color:var(--neutro)}
.an-linha:hover{background:var(--papel)}.an-linha.sel{background:var(--papel);box-shadow:inset 2px 0 0 var(--marinho) !important}
.an-linha .nm{color:var(--grafite)}

/* ---- linhas de status (sem vermelho/verde: cor + peso + preenchimento) ---- */
.linha{background:var(--pedra);border:1px solid var(--pedra);border-left:4px solid var(--neutro)}
.linha.concluido,.linha.prazo{border-left-color:var(--marinho)}
.linha.pendente,.linha.agendada{border-left-color:var(--aco)}
.linha.atrasado,.linha.atrasada{border-left:8px solid var(--grafite)}
.linha.naorecebido,.linha.sem{border-left-color:var(--neutro)}
.linha .nome a{font-family:var(--sans);font-weight:600;font-size:16px;color:var(--marinho)}
.linha .gestora,.linha .dado{color:var(--ardosia)}
.linha .dado b{color:var(--grafite)}
.linha .dado b.vermelho{color:var(--grafite);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.selo{padding:3px 10px;font-size:10.5px;line-height:16px;border:1px solid transparent}
.selo.ok,.selo.prazo{background:var(--marinho);color:var(--papel)}
.selo.azul,.selo.agendada{background:var(--nevoa);color:var(--marinho)}
.selo.warn{background:transparent;border-color:var(--taupe);color:var(--grafite)}
.selo.danger,.selo.atrasada{background:var(--grafite);color:var(--papel);font-weight:700}
.selo.sem{background:transparent;border-color:var(--neutro);color:var(--ardosia)}
.selo.prio{border-color:var(--neutro);color:var(--ardosia)}
.selo.prio.p1{border-color:var(--marinho);color:var(--marinho);font-weight:700}
.sugestao .ja{background:var(--nevoa);color:var(--marinho);padding:1px 7px}

/* ---- avisos / mensagens ---- */
.aviso,.nota-bloco,.inf,.diagnostico,.aviso-conteudo-ausente,.modal .aviso-prevista,.att .imp{
  background:var(--pedra);color:var(--grafite);border-left:3px solid var(--taupe);font-size:14px;line-height:22px}
#erro,.erro,.alerta-conflito{background:var(--pedra);color:var(--grafite);border:1px solid var(--grafite);border-left:6px solid var(--grafite);font-weight:500}
.alerta-conflito button{border-color:var(--grafite);color:var(--grafite)}
.alerta-conflito button:hover{background:var(--grafite);color:var(--papel)}
.form-msg.ok,.modal-msg.ok{color:var(--marinho)}
.form-msg.erro,.modal-msg.erro{color:var(--grafite);font-weight:600}
#carregando,.carregando{color:var(--ardosia)}
.pill{background:var(--nevoa);color:var(--marinho);font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase}

/* ---- tabelas ---- */
table{font-size:14px}
th{font-size:11px;color:var(--marinho);border-bottom:2px solid var(--marinho)}
td{border-bottom:1px solid var(--fio)}
td.txt{color:var(--ardosia)}
tbody tr:nth-child(odd):not(.detalhe):not(.total){background:transparent}
tbody tr:hover:not(.detalhe),tr.clicavel:hover{background:var(--pedra)}
tr.total td{background:var(--pedra);border-top:2px solid var(--marinho);color:var(--marinho)}
td.neg{color:var(--grafite);font-weight:700}
td.pos{color:var(--marinho);font-weight:600}
td.vazio{color:var(--taupe)}
tr.detalhe td{background:var(--pedra);color:var(--ardosia)}
tr.linha-ativa td{background:var(--nevoa)}
tr.linha-ativa td.txt{color:var(--marinho);font-weight:600}

/* ---- página do fundo ---- */
section{border-top:1px solid var(--fio)}
.meta{color:var(--ardosia);font-size:14px;line-height:24px}
.meta strong{color:var(--grafite)}
.sh{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--marinho);font-weight:500}
.att .n{font-family:var(--mono);color:var(--taupe)}
.row{border-bottom:1px solid var(--fio)}
.row span:first-child{color:var(--ardosia)}
#indiceLateral a{font-family:var(--sans);color:var(--ardosia);border-left:2px solid var(--fio)}
#indiceLateral a:hover{background:var(--pedra);color:var(--marinho);border-left-color:var(--aco)}
#indiceLateral a.ativo{color:var(--marinho);border-left-color:var(--marinho);font-weight:600}
.hist-periodo{border-bottom-color:var(--neutro)}
.hist-periodo span{font-family:var(--sans);font-weight:600;font-size:16px;color:var(--marinho)}
.ev-m2df{border-left:3px solid var(--marinho)}
.tag{background:transparent;border:1px solid var(--taupe);color:var(--grafite);padding:0 8px;font-size:10px}
.tag-m2df{background:var(--marinho);border-color:var(--marinho);color:var(--papel);font-weight:600}
.ev .fu{color:var(--grafite);font-weight:600}
.marca-editado{background:var(--pedra);color:var(--ardosia);font-family:var(--mono)}
.note{border-top:1px dashed var(--neutro)}

/* ---- modo edição ---- */
.barra-edicao{background:var(--pedra);border-bottom:2px solid var(--taupe)}
.barra-edicao .texto{color:var(--grafite);font-size:14px}
body.editando section{border:1px dashed var(--taupe);background:var(--papel)}
body.editando .editavel:hover{background:var(--pedra);box-shadow:none !important}
.ferramentas-bloco{background:var(--papel);border:1px solid var(--neutro)}
.ferramentas-bloco button:hover,.btn-item:hover{background:var(--pedra)}

/* ---- calendário ---- */
.cal{padding:24px}
.cal-mes{font-family:var(--sans);font-weight:600;font-size:20px;color:var(--marinho)}
.cal-nav button{border:1px solid var(--neutro);background:transparent;color:var(--marinho);min-width:36px;min-height:36px}
.cal-nav button:hover{background:var(--papel)}
.cal-dia{background:var(--papel);border:1px solid var(--fio)}
.cal-dia.fora{background:transparent;color:var(--taupe);border-color:transparent}
.cal-dia.hoje{border:2px solid var(--marinho)}
.cal-dia.tem-agendada{background:var(--nevoa);border-color:var(--aco)}
.cal-dia.tem-realizada{background:var(--marinho);border-color:var(--marinho)}
.cal-dia.tem-realizada .num{color:var(--papel)}
.cal-dia.tem-prevista{background:var(--pedra);border:1px dashed var(--taupe)}
.cal-dia.tem-agendada.tem-realizada{background:linear-gradient(135deg,var(--nevoa) 50%,var(--marinho) 50%)}
.cal-dia .num{font-family:var(--mono);font-size:11px;color:var(--ardosia)}
.cal-dia.hoje .num{color:var(--marinho);font-weight:700}
.compacto .cal-dia:hover,.mini-mes .cal-dia:hover{outline:2px solid var(--marinho)}
.ponto{border-radius:0;width:6px;height:6px}
.ponto.agendada{background:var(--aco)}.ponto.realizada{background:var(--papel);outline:1px solid var(--marinho)}.ponto.prevista{background:transparent;border:1px dashed var(--taupe)}
.cal-ev{font-family:var(--mono);font-size:10px;letter-spacing:.04em}
.cal-ev.agendada{background:var(--nevoa);color:var(--marinho)}
.cal-ev.realizada{background:var(--marinho);color:var(--papel)}
.cal-ev.prevista{background:var(--pedra);color:var(--ardosia);border:1px dashed var(--taupe)}
.mini-mes .titulo{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--marinho)}
.cal-legenda{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ardosia)}
.modal-fundo{background:rgba(29,39,51,.6)}
.modal{padding:32px;border-top:3px solid var(--taupe);background:var(--papel);border-color:var(--papel)}
.sugestoes{background:var(--papel);border:1px solid var(--neutro)}
.sugestao{border-bottom:1px solid var(--fio)}
.sugestao:hover,.sugestao.marcada{background:var(--pedra)}

/* ---- capa (index) ---- */
.capa{background:var(--marinho);color:var(--papel);text-align:left;padding:112px 0 96px}
.capa .wrap,.capa>div{text-align:left}
.capa img{height:48px;margin-bottom:48px}
.capa h1{font-family:var(--sans);font-weight:700;font-size:56px;line-height:64px;color:var(--papel);margin:0 0 24px;max-width:14ch}
.capa .linha{width:64px;height:3px;background:var(--taupe);opacity:1;margin:0 0 24px;border:0;padding:0}
.capa p{color:var(--neutro);font-size:18px;line-height:28px;max-width:52ch;margin:0 0 40px}
.capa button{background:var(--papel);color:var(--marinho);border:1px solid var(--papel)}
.capa button:hover{background:var(--nevoa);border-color:var(--nevoa)}
.capa .rodape{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--nevoa);margin-top:64px}
#loginArea,#capaLogin{padding:96px 0;text-align:left}
#loginArea .logo-login{max-width:200px}
@media (max-width:639px){.capa{padding:72px 0 64px}.capa h1{font-size:36px;line-height:44px}}

/* ---- rodapé de marca ---- */
.rodape-marca{border-top:1px solid var(--neutro);background:var(--papel);padding:24px 0;margin-top:0}
.rodape-marca .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ardosia)}
.selo-classe{border:1px solid var(--marinho);color:var(--marinho);padding:2px 10px}

/* ---- monitoramento: tabela/quadro ---- */
.t-cab{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--marinho);border-bottom:2px solid var(--marinho)}
.t-nome a{font-family:var(--sans);font-size:16px;color:var(--marinho)}
.t-nome small,.nd{color:var(--ardosia)}
b.vermelho{color:var(--grafite);font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.q-grupo{background:var(--pedra);border:1px solid var(--pedra);border-top:3px solid var(--taupe)}
.q-grupo summary .nm{font-family:var(--sans);font-weight:600;font-size:20px;color:var(--marinho)}
.q-grupo summary .ct{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ardosia)}
.q-grupo summary:before{color:var(--marinho)}
.q-grupo .t-lin{border-bottom:1px solid var(--neutro)}
.q-grupo .t-lin:hover{background:var(--papel)}
.sit{color:var(--ardosia)}.sit.atr{color:var(--grafite);font-weight:700}.sit.nao{color:var(--taupe)}
h1 .ref{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ardosia)}