/* Ícones hospedados no próprio ADVFLOW (sem depender do Google Fonts; o ARCA só aceita recurso do próprio endereço). */
@font-face { font-family: "Material Symbols Outlined"; font-style: normal; font-weight: 300 500; font-display: block;
             src: url("../fonts/material-symbols-outlined.woff2") format("woff2"); }
/* ADVFLOW — visual espelhado do ADVBOX.
   Fontes de verdade: app.css público do ADVBOX + telas capturadas em 26/09/2026 (modo escuro medido pixel a pixel:
   fundo #161e29, cartão #202a36, divisória #1f2935, pílula de tema #28323d, azul #2f81f7, ativo #338dfa).
   Fonte: a do sistema, como no ADVBOX. Ícones: Material Symbols Outlined (mesmos nomes do ADVBOX). */
:root {
  --azul: #2f81f7; --azul-forte: #1f6fe0; --azul-suave: #e9f2ff; --ativo: #338dfa;
  --verde: #1db954; --verde-suave: #e3f7ea; --vermelho: #ff4b4b; --vermelho-suave: #ffecec;
  --amarelo: #f5b400; --amarelo-suave: #fff5d6;
  --fundo: #ffffff; --cartao: #f6f8fa; --cartao-2: #eef1f4; --borda: #e8e8e8; --divisoria: #eeeeee;
  --texto: #24292e; --texto-2: #586069; --texto-3: #7d8590;
  --lateral: #ffffff; --lateral-item: #7d7d7d; --lateral-hover: #24292e;
  --campo: #ffffff; --pilula: #eeeeee; --pilula-ativa: #ffffff;
  --raio: 6px;
  --fonte: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
  color-scheme: light;
}
[data-theme="escuro"] {
  --azul-suave: #1b2a3f; --verde-suave: #16332a; --vermelho-suave: #3a1d22; --amarelo-suave: #3a3118;
  --fundo: #161e29; --cartao: #202a36; --cartao-2: #28323d; --borda: #28323d; --divisoria: #1f2935;
  --texto: #e6edf3; --texto-2: #a9b1b7; --texto-3: #7d8590;
  --lateral: #161e29; --lateral-item: #7d8590; --lateral-hover: #e6edf3;
  --campo: #161e29; --pilula: #28323d; --pilula-ativa: #2f81f7;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--fundo); color: var(--texto); font: 14px/1.45 var(--fonte); }
a { color: var(--azul); text-decoration: none; }
a:hover { text-decoration: underline; }
[data-theme="escuro"] a { color: #5bb0ff; }
h1 { font-size: 18px; font-weight: 400; margin: 0; }
h2 { font-size: 14px; font-weight: 400; color: var(--texto-3); margin: 0 0 10px; }
h3 { font-size: 12px; margin: 14px 0 6px; font-weight: 600; color: var(--texto-3); text-transform: uppercase; letter-spacing: .04em; }
.muted { color: var(--texto-2); } .fraco { color: var(--texto-3); font-size: 12px; }
.ms { font-family: "Material Symbols Outlined"; font-weight: normal; font-style: normal; font-size: 20px; line-height: 1;
      display: inline-block; white-space: nowrap; direction: ltr; -webkit-font-smoothing: antialiased; vertical-align: middle;
      font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 20; }

/* ---------- Estrutura: lateral fixa de 220px + topo ---------- */
.app { display: grid; grid-template-columns: 220px 1fr; min-height: 100vh; }
.lateral { background: var(--lateral); border-right: 1px solid var(--borda); position: sticky; top: 0; height: 100vh;
           overflow-y: auto; display: flex; flex-direction: column; }
[data-theme="escuro"] .lateral { border-color: #30363d; }
.marca { display: flex; align-items: center; gap: 9px; height: 55px; padding: 0 20px; color: var(--texto) !important; text-decoration: none !important; }
.marca img { height: 24px; }
.marca .nome { font-size: 19px; letter-spacing: .14em; font-weight: 300; }
.menu { list-style: none; margin: 10px 0 0; padding: 0; }
.menu a { position: relative; display: flex; align-items: center; gap: 12px; padding: 0 20px; line-height: 40px;
          color: var(--lateral-item) !important; font-size: 14px; text-decoration: none !important; }
.menu a .ms { font-size: 20px; }
.menu a:hover { color: var(--lateral-hover) !important; }
.menu a.ativo { color: var(--ativo) !important; }
[data-theme="escuro"] .menu a.ativo { color: #fff !important; }
.menu a.ativo:before { content: ""; position: absolute; left: 1px; top: 10px; bottom: 10px; width: 3px; background: #338dfa; }
.menu .cont { margin-left: auto; background: var(--vermelho); color: #fff; border-radius: 10px; font-size: 10px; line-height: 16px; padding: 0 6px; }
.menu .sep { height: 1px; background: var(--borda); margin: 18px 30px; }

.topo { height: 55px; display: flex; align-items: center; gap: 12px; padding: 0 20px; background: var(--fundo);
        position: sticky; top: 0; z-index: 5; }
.busca { position: relative; width: 320px; }
.busca input { width: 100%; height: 40px; padding: 0 14px 0 40px; border-radius: 100px; border: 1px solid var(--borda);
               background: var(--campo); color: var(--texto); font: inherit; }
[data-theme="escuro"] .busca input { border-color: #3b4450; }
.busca input:focus { outline: none; border-color: #2f81f7; }
.busca .ms { position: absolute; left: 12px; top: 10px; color: var(--texto-2); }
.topo .direita { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.escolha-tema { display: flex; background: var(--pilula); border: 0; border-radius: 20px; padding: 3px; cursor: pointer; }
.escolha-tema .tema { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; color: var(--texto-2); }
.escolha-tema .tema .ms { font-size: 17px; }
.escolha-tema .tema.ativo { background: var(--pilula-ativa); color: var(--texto); box-shadow: 0 1px 2px rgba(0,0,0,.15); }
[data-theme="escuro"] .escolha-tema .tema.ativo { color: #fff; }
.sino { position: relative; color: var(--texto-2) !important; display: grid; place-items: center; }
.sino .ms { font-size: 24px; }
.sino .bolinha { position: absolute; top: -6px; right: -6px; background: var(--vermelho); color: #fff; font-size: 9px;
                 min-width: 16px; height: 16px; line-height: 16px; text-align: center; border-radius: 8px; padding: 0 3px; }
.suspenso { position: relative; }
.suspenso > .painel { display: none; position: absolute; right: 0; top: calc(100% + 6px); background: var(--fundo);
                      border: 1px solid var(--borda); border-radius: 6px; min-width: 200px; z-index: 20;
                      box-shadow: 0 0 4px rgba(0,0,0,.15), 0 4px 10px rgba(0,0,0,.1); padding: 6px 0; }
[data-theme="escuro"] .suspenso > .painel { background: var(--cartao); }
.suspenso:focus-within > .painel, .suspenso.aberto > .painel { display: block; }
.suspenso .painel a, .suspenso .painel button { display: block; width: 100%; text-align: left; padding: 8px 16px; color: var(--texto) !important;
                  background: none; border: 0; font: inherit; cursor: pointer; text-decoration: none !important; }
.suspenso .painel a:hover, .suspenso .painel button:hover { background: var(--cartao-2); }
.btn-adicionar { display: inline-flex; align-items: center; gap: 22px; height: 36px; padding: 0 12px 0 20px; border-radius: 100px;
                 background: var(--azul); color: #fff; border: 0; font: inherit; cursor: pointer; }
.perfil { display: flex; align-items: center; gap: 8px; background: none; border: 0; color: var(--texto); font: inherit; cursor: pointer; padding: 0; }
.perfil .ms { font-size: 16px; color: var(--texto-3); }
.avatar { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-weight: 600; font-size: 12px; flex: none; }
.avatar.p { width: 28px; height: 28px; font-size: 10.5px; border: 2px solid var(--fundo); }
.avatares { display: flex; } .avatares .avatar + .avatar { margin-left: -8px; }

.conteudo { padding: 20px 20px 60px; }
.avisos { list-style: none; margin: 0 0 14px; padding: 0; }
.avisos li { padding: 10px 14px; border-radius: 6px; margin-bottom: 8px; background: var(--azul-suave); }
.avisos li.success { background: var(--verde-suave); } .avisos li.error { background: var(--vermelho-suave); }

/* ---------- Cartões de resumo (summary-header do ADVBOX) ---------- */
.resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; margin-bottom: 15px; }
.cartao { background: var(--cartao); border-radius: var(--raio); padding: 18px 16px; }
:root:not([data-theme="escuro"]) .cartao { border: 1px solid var(--borda); }
.cartao.link { color: inherit !important; text-decoration: none !important; display: block; }
.cartao.link:hover { filter: brightness(1.04); }
.cartao h4 { margin: 0 0 8px; font-size: 14px; font-weight: 400; color: var(--texto-2); }
.cartao .total { font-size: 24px; line-height: 1.2; display: flex; align-items: center; gap: 10px; }
.cartao .rodape { color: var(--texto-2); font-size: 13px; margin-top: 8px; }
.variacao { font-size: 10px; padding: 2px 8px; border-radius: 10px; display: inline-flex; align-items: center; gap: 3px; }
.variacao.sobe { background: var(--verde-suave); color: #2ecc8a; } .variacao.desce { background: var(--vermelho-suave); color: var(--vermelho); }
.variacao .ms { font-size: 12px; }
.grade { display: grid; gap: 15px; }
.g-graficos { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr) 300px; margin-bottom: 25px; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g-lateral { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.cartao .cab { display: flex; align-items: center; margin-bottom: 12px; } .cab h2 { margin: 0; } .cab .acoes { margin-left: auto; display: flex; gap: 8px; }
.cab .acoes a, .cab .acoes button { color: var(--texto-3) !important; background: none; border: 0; cursor: pointer; }
.lista-resumo { list-style: none; margin: 0; padding: 0; }
.lista-resumo li { display: flex; justify-content: space-between; padding: 9px 0; color: var(--texto-2); }
.lista-resumo li strong { color: var(--texto); font-weight: 600; }

/* Minicalendário */
.minical table { width: 100%; border-collapse: collapse; text-align: center; font-size: 13px; }
.minical th { color: var(--texto-2); font-weight: 600; padding: 8px 0; }
.minical td { padding: 0; height: 35px; position: relative; }
.minical td a { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: var(--texto) !important; text-decoration: none !important; font-weight: 600; }
.minical td.fora a { color: var(--texto-3) !important; opacity: .5; font-weight: 400; }
.minical td.hoje a { background: var(--cartao-2); }
.minical .qt { position: absolute; top: -2px; left: 50%; transform: translateX(2px); background: var(--vermelho); color: #fff; font-size: 8px;
               min-width: 14px; height: 14px; line-height: 14px; border-radius: 7px; padding: 0 3px; }

/* ---------- Seção + barra de ações + tabela (molde de todas as listagens) ---------- */
.secao { display: flex; align-items: center; gap: 8px; margin: 10px 0 14px; }
.secao h1 { font-size: 18px; } .secao .ms { color: var(--texto-2); }
.acoes-lista { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.btn { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 4px; border: 0; background: transparent;
       color: var(--texto-2) !important; font: inherit; cursor: pointer; text-decoration: none !important; white-space: nowrap; }
.btn:hover { background: var(--cartao-2); color: var(--texto) !important; }
.btn .ms { font-size: 19px; }
.btn.primario { background: var(--azul); color: #fff !important; } .btn.primario:hover { background: var(--azul-forte); }
.btn.contorno { border: 1px solid var(--borda); color: var(--texto) !important; }
.btn.verde { background: var(--verde); color: #fff !important; }
.btn.perigo { color: var(--vermelho) !important; }
.btn.peq { height: 28px; padding: 0 10px; font-size: 12.5px; }
.acoes-lista .div { width: 1px; height: 22px; background: var(--texto-3); opacity: .5; margin: 0 10px; }
.acoes-lista .icone { position: relative; color: var(--texto-2) !important; padding: 0 6px; }
.acoes-lista .icone .qt { position: absolute; top: -9px; right: -6px; background: var(--vermelho); color: #fff; font-size: 9px;
                          min-width: 16px; height: 16px; line-height: 16px; text-align: center; border-radius: 8px; padding: 0 4px; }
.filtros { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: -4px 0 14px; }
.filtros[hidden] { display: none; }
.campo { width: 100%; height: 36px; padding: 0 12px; border: 1px solid var(--borda); border-radius: 4px; background: var(--campo); color: var(--texto); font: inherit; }
textarea.campo { height: auto; padding: 8px 12px; resize: vertical; }
select[multiple].campo { height: auto; }
.campo:focus { outline: none; border-color: var(--azul); }
.filtros .campo { width: auto; min-width: 160px; }
label { display: block; font-size: 12.5px; color: var(--texto-2); margin-bottom: 4px; }
.form-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px 18px; }
.form-grade .largo { grid-column: 1 / -1; }
.ajuda { font-size: 11.5px; color: var(--texto-3); margin-top: 3px; } .erro { color: var(--vermelho); font-size: 12px; }

.tabela { width: 100%; border-collapse: collapse; }
.tabela th { text-align: left; font-size: 10px; font-weight: 400; text-transform: uppercase; letter-spacing: .03em; color: var(--texto-2);
             padding: 12px 8px; }
.tabela td { padding: 14px 8px; border-top: 1px solid var(--divisoria); font-size: 13px; vertical-align: middle; }
.tabela td.forte, .tabela td strong { font-weight: 700; }
.tabela tr:hover td { background: var(--cartao); }
.tabela .num, .tabela .dir { text-align: right; }
.tabela a.linha { color: var(--texto) !important; text-decoration: none !important; }
.tabela a.linha:hover { color: var(--azul) !important; }
.vazio { padding: 30px; text-align: center; color: var(--texto-3); }
.data-venc { color: var(--vermelho); font-weight: 700; } .data-hoje { color: var(--amarelo); font-weight: 700; }
.tarefa-linha .marcas { display: flex; align-items: center; gap: 14px; white-space: nowrap; }
.tarefa-linha .marcas .ms { font-size: 20px; }
.estrela { color: #f5b400; } .estrela.vazia { color: var(--texto-3); }
.urg { color: var(--vermelho); font-weight: 800; font-size: 18px; } .urg.nao { color: var(--texto-3); }
.bolinha-status { width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid var(--verde); display: inline-block; }
.check { width: 16px; height: 16px; border: 1.5px solid var(--texto-2); border-radius: 3px; background: none; cursor: pointer; padding: 0; display: inline-block; }
.check:hover { border-color: var(--verde); background: var(--verde-suave); }
.check.feito { background: var(--verde); border-color: var(--verde); }
.tag { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 11px; background: var(--cartao-2); color: var(--texto-2); white-space: nowrap; }
.tag.azul { background: var(--azul-suave); color: var(--azul); } .tag.verde { background: var(--verde-suave); color: #22a95a; }
.tag.amarela { background: var(--amarelo-suave); color: #c48f00; } .tag.vermelha { background: var(--vermelho-suave); color: var(--vermelho); }
[data-theme="escuro"] .tag.azul { color: #5bb0ff; } [data-theme="escuro"] .tag.amarela { color: #f5c542; }
.pontos { font-weight: 700; color: #2ecc8a; }
.paginacao { display: flex; gap: 12px; align-items: center; justify-content: flex-end; padding: 14px 0; color: var(--texto-2); font-size: 13px; }

.abas { display: flex; gap: 2px; border-bottom: 1px solid var(--borda); margin-bottom: 14px; flex-wrap: wrap; }
.abas a { padding: 10px 14px; color: var(--texto-2) !important; border-bottom: 2px solid transparent; margin-bottom: -1px; text-decoration: none !important; }
.abas a.ativo { color: var(--azul) !important; border-color: var(--azul); }
.pilula { display: inline-flex; gap: 2px; background: var(--cartao); border-radius: 20px; padding: 3px; }
.pilula a { padding: 5px 12px; border-radius: 16px; color: var(--texto-2) !important; font-size: 12.5px; text-decoration: none !important; }
.pilula a.ativo { background: var(--azul); color: #fff !important; }
dl.ficha { display: grid; grid-template-columns: 140px 1fr; gap: 7px 12px; margin: 0; }
dl.ficha dt { color: var(--texto-3); font-size: 12.5px; } dl.ficha dd { margin: 0; }
.texto-pub { white-space: pre-wrap; font-size: 13.5px; line-height: 1.6; background: var(--fundo); padding: 16px; border-radius: 6px;
             border: 1px solid var(--borda); max-height: 70vh; overflow: auto; }
.cabecalho { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.cabecalho .direita { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.migalha { font-size: 12px; color: var(--texto-3); margin-bottom: 3px; }

/* Ranking / Taskscore */
.rank { list-style: none; padding: 0; margin: 0; }
.rank li { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--divisoria); }
.rank .barra { flex: 1; height: 8px; background: var(--cartao-2); border-radius: 5px; overflow: hidden; }
.rank .barra i { display: block; height: 100%; background: var(--azul); border-radius: 5px; }
.pos { width: 26px; text-align: center; font-weight: 700; color: var(--texto-3); }
.pos.p1 { color: #f5b400; } .pos.p2 { color: #a9b1b7; } .pos.p3 { color: #cd7f32; }
.legenda { display: flex; gap: 16px; justify-content: center; font-size: 10px; text-transform: uppercase; color: var(--texto-2); margin-bottom: 6px; }
.legenda i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid; margin-right: 5px; vertical-align: -1px; }
svg.grafico { width: 100%; height: 190px; }
svg.grafico text { fill: var(--texto-2); font-size: 11px; }
svg.grafico .eixo { stroke: var(--divisoria); }

/* Agenda */
.cal { display: grid; grid-template-columns: repeat(7, 1fr); border-top: 1px solid var(--divisoria); border-left: 1px solid var(--divisoria); }
.cal .dsem { padding: 8px; font-size: 11px; text-transform: uppercase; color: var(--texto-2); border-right: 1px solid var(--divisoria); border-bottom: 1px solid var(--divisoria); }
.cal .dia { min-height: 118px; padding: 6px; border-right: 1px solid var(--divisoria); border-bottom: 1px solid var(--divisoria); }
.cal .dia.fora { opacity: .45; }
.cal .dia.hoje .n { background: var(--azul); color: #fff !important; }
.cal .n { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; font-size: 12px; font-weight: 600; color: var(--texto) !important; text-decoration: none !important; }
.cal .ev { display: block; font-size: 11.5px; padding: 2px 6px; border-radius: 4px; margin-top: 3px; white-space: nowrap; overflow: hidden;
           text-overflow: ellipsis; color: var(--texto) !important; border-left: 3px solid var(--azul); background: var(--cartao); text-decoration: none !important; }
.cal .ev.prazo { border-left-color: var(--vermelho); }

/* Entrar (no molde da tela de login do ADVBOX: coluna branca de 400px + arte) */
.tela-entrar { min-height: 100vh; display: grid; grid-template-columns: 400px 1fr; }
.tela-entrar .lado { background: var(--fundo); display: flex; flex-direction: column; justify-content: center; padding: 40px 30px; }
.tela-entrar .arte { background: linear-gradient(90deg, #0f1824 0%, #1a2b44 55%, #2658a8 100%); display: grid; place-items: center; }
.tela-entrar .arte img { width: 380px; opacity: .95; }
.tela-entrar .campo-linha { border: 0; border-bottom: 1px solid var(--borda); border-radius: 0; height: 44px; padding: 0 4px; background: transparent; }
.tela-entrar .btn.primario { width: 100%; justify-content: center; border-radius: 100px; height: 40px; margin-top: 22px; }

@media (max-width: 1100px) { .g-graficos { grid-template-columns: 1fr 1fr; } .g-graficos .minical { grid-column: 1 / -1; } }
@media (max-width: 800px) {
  .app { grid-template-columns: 1fr; } .lateral { position: static; height: auto; }
  .g2, .g3, .g-lateral, .g-graficos { grid-template-columns: 1fr; } .busca { width: auto; flex: 1; }
  .tela-entrar { grid-template-columns: 1fr; } .tela-entrar .arte { display: none; }
}
@media print {
  .lateral, .topo, .acoes-lista, .filtros, .cabecalho .direita, .paginacao { display: none !important; }
  .app { display: block; } body { background: #fff; color: #000; }
}

/* ---------- Compatibilidade das telas secundárias (mesmo visual do molde) ---------- */
.card { background: var(--cartao); border-radius: var(--raio); padding: 18px 16px; }
:root:not([data-theme="escuro"]) .card { border: 1px solid var(--borda); }
.card + .card { margin-top: 15px; } .grade > .card + .card { margin-top: 0; }
.card.sem-pad { padding: 0; } .card.sem-pad .tabela th:first-child, .card.sem-pad .tabela td:first-child { padding-left: 16px; }
.card .cab { display: flex; align-items: center; gap: 8px; padding: 14px 16px; }
.card .cab h2 { margin: 0; color: var(--texto); } .card .cab .direita { margin-left: auto; }
.card h2 { color: var(--texto); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .g-painel { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.kpi { display: flex; align-items: center; gap: 14px; } .kpi .n { font-size: 24px; } .kpi .l { color: var(--texto-2); font-size: 13px; }
.kpi .ico { width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; background: var(--azul-suave); color: var(--azul); }
.lista-t { list-style: none; margin: 0; padding: 0; }
.lista-t li { display: flex; gap: 12px; align-items: flex-start; padding: 11px 16px; border-top: 1px solid var(--divisoria); }
.lista-t .corpo { flex: 1; min-width: 0; } .lista-t .titulo { font-weight: 600; color: var(--texto) !important; }
.lista-t .sub { color: var(--texto-2); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.check-btn { width: 16px; height: 16px; border: 1.5px solid var(--texto-2); border-radius: 3px; background: none; cursor: pointer; margin-top: 2px; }
.check-btn:hover { border-color: var(--verde); background: var(--verde-suave); } .check-btn.feito { background: var(--verde); border-color: var(--verde); }
.btn.ok { background: var(--verde); color: #fff !important; }
.cartao h4 .ms { font-size: 18px; color: var(--azul); margin-right: 4px; }

.menu .rot { margin: 18px 20px 4px; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--texto-3); }
.alerta-faixa { display: flex; gap: 10px; align-items: flex-start; padding: 12px 16px; border-radius: 6px; background: var(--vermelho-suave); color: var(--texto); margin-bottom: 15px; }
.alerta-faixa .ms { color: var(--vermelho); }
.alerta-faixa.amarela { background: var(--amarelo-suave); } .alerta-faixa.amarela .ms { color: #c48f00; }

/* ---------- Meu Painel no molde do ADVBOX ---------- */
.painel-topo { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 15px; margin-bottom: 20px; }
.g-graficos2 { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.cartao { position: relative; } .cartao .seta { position: absolute; right: 16px; top: 50%; color: var(--texto-2); }
.minical .cab-cal { display: flex; align-items: center; justify-content: space-between; margin: 6px 0 8px; }
.pilula-mini { display: inline-flex; background: var(--cartao-2); border-radius: 4px; padding: 2px; margin-right: 6px; }
.pilula-mini a { font-size: 11px; padding: 3px 8px; border-radius: 3px; color: var(--texto-2) !important; text-decoration: none !important; }
.pilula-mini a.ativo { background: var(--fundo); color: var(--texto) !important; }
.compromissos .grupo-cab td { border-top: 0; padding: 18px 8px 10px; }
.grupo-alternar { display: inline-flex; align-items: center; gap: 10px; background: none; border: 0; color: var(--texto); font: inherit; font-size: 17px; cursor: pointer; padding: 0; }
.grupo-alternar .ms { color: var(--texto-2); transition: transform .15s; }
.recolhido .grupo-alternar .ms { transform: rotate(180deg); }
.recolhido tr:not(.grupo-cab) { display: none; }
.grupo-conta { float: right; color: var(--texto-2); font-size: 13px; }
.grupo-conta .mostrando { margin-left: 22px; } .grupo-conta .caixa { display: inline-block; border: 1px solid var(--borda); border-radius: 4px; padding: 2px 30px 2px 8px; margin-left: 6px; }
.tarefa-linha td { padding: 16px 8px; }
.tarefa-linha .col-marcas { width: 118px; } .tarefa-linha .col-partes { width: 270px; text-transform: uppercase; font-size: 13px; }
.tarefa-linha .col-data { width: 118px; white-space: nowrap; } .tarefa-linha .col-resp { width: 190px; text-align: right; position: relative; }
.tarefa-linha .titulo-tarefa { text-transform: none; color: var(--texto) !important; }
.tarefa-linha .cli { color: var(--texto); } .tarefa-linha .contra { color: var(--texto-2); }
.tarefa-linha.nao-lida .titulo-tarefa, .tarefa-linha.nao-lida .cli, .tarefa-linha.nao-lida .contra, .tarefa-linha.nao-lida .col-data { font-weight: 700; }
.tarefa-linha .col-tarefa { max-width: 0; width: 100%; }
.tarefa-linha .titulo-tarefa { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: none; font-size: 14px; }
.tarefa-linha .titulo-tarefa .tipo { text-transform: uppercase; }
.bolinha-status { width: 9px; height: 9px; border: 1.5px solid var(--texto-3); }
.tarefa-linha.nao-lida .bolinha-status { border-color: var(--verde); }
.acoes-linha { display: none; gap: 16px; justify-content: flex-end; align-items: center; }
.acoes-linha a { color: var(--texto) !important; } .acoes-linha .ms { font-size: 22px; }
.tarefa-linha:hover .acoes-linha { display: flex; } .tarefa-linha:hover .so-parado { display: none; }
.avatares { justify-content: flex-end; } .avatar.vazio { background: #fff; color: #9aa4ad; } .avatar.vazio .ms { font-size: 20px; }
@media (max-width: 1100px) { .painel-topo { grid-template-columns: 1fr; } }
svg.grafico-barras { width: 100%; height: 210px; }
svg.grafico-barras text { fill: var(--texto-2); font-size: 11px; } svg.grafico-barras text.rot { font-size: 12px; }
svg.grafico-barras .eixo { stroke: var(--divisoria); }
.g-lista3 { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) 300px; margin-bottom: 20px; }
.g-contatos { grid-template-columns: minmax(0, 2fr) minmax(0, .8fr) minmax(0, .8fr); margin-bottom: 20px; }
.g-processos { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); margin-bottom: 20px; }
.numero-grande { font-size: 40px; font-weight: 700; text-align: center; margin-top: 50px; }
.meta-barra { height: 10px; background: var(--cartao-2); border-radius: 5px; overflow: hidden; margin: 8px 0; } .meta-barra i { display: block; height: 100%; background: #22c55e; }
@media (max-width: 1100px) { .g-lista3, .g-contatos, .g-processos { grid-template-columns: 1fr; } }

/* ---------- Agenda no molde do ADVBOX ---------- */
.agenda-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 60px; }
.agenda-lado h2 { color: var(--texto); font-size: 15px; margin: 18px 0 10px; }
.agenda-lado .campo { margin-bottom: 10px; background: var(--cartao); border-color: transparent; height: 38px; font-size: 13px; }
.pilula-bloco { display: flex; background: var(--cartao); border-radius: 6px; padding: 4px; }
.pilula-bloco a { flex: 1; text-align: center; padding: 7px 0; border-radius: 4px; color: var(--texto-2) !important; font-size: 13px; text-decoration: none !important; }
.pilula-bloco a.ativo { background: var(--fundo); color: var(--texto) !important; }
.sep-h { height: 1px; background: var(--borda); margin: 16px 0; }
.marcar-linha { display: flex; align-items: center; gap: 8px; color: var(--texto); font-size: 13px; margin: 8px 0; cursor: pointer; }
.bol { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--azul); }
.bol.pendente { background: #fff; border: 1px solid var(--texto-3); } .bol.concluida { background: var(--verde); } .bol.atrasada { background: var(--vermelho); }
.legenda-status { display: flex; flex-direction: column; gap: 10px; font-size: 13px; color: var(--texto-2); } .legenda-status span { display: flex; align-items: center; gap: 8px; }
.agenda-cab { display: flex; align-items: center; gap: 8px; margin: 6px 0 22px; } .agenda-cab a { color: var(--texto) !important; } .agenda-cab h1 { font-size: 20px; margin-left: 6px; }
.cal-advbox { border-color: var(--borda); } .cal-advbox .dsem { border: 0; text-align: center; text-transform: none; font-size: 14px; }
.cal-advbox .dia { min-height: 105px; text-align: right; border-color: var(--borda); }
.cal-advbox .dia .n { font-weight: 400; color: var(--texto) !important; } .cal-advbox .dia.fora .n { color: var(--texto-3) !important; }
.cal-advbox .dia.hoje .n { background: var(--azul); color: #fff !important; }
.cal-advbox .ev { text-align: left; border-left-width: 3px; } .cal-advbox .ev.tarefa.pendente { border-left-color: var(--texto-3); }
.cal-advbox .ev.tarefa.concluida { border-left-color: var(--verde); } .cal-advbox .ev.tarefa.atrasada { border-left-color: var(--vermelho); }
.cal-advbox .mais { display: block; text-align: left; font-size: 11px; color: var(--texto-2) !important; margin-top: 3px; }
@media (max-width: 900px) { .agenda-layout { grid-template-columns: 1fr; gap: 20px; } }

.andamento .ms { font-size: 16px; color: var(--azul); vertical-align: -3px; }

/* Logo completa do escritório no alto da lateral (pedido do Paulo, 26/09/2026) */
.marca.marca-completa { flex-direction: column; align-items: center; height: auto; padding: 18px 20px 10px; gap: 6px; }
.marca.marca-completa img { width: 170px; height: auto; }
.marca.marca-completa .nome { font-size: 11px; letter-spacing: .32em; color: var(--texto-3); font-weight: 400; }