@import url("/assets/css/anc-design-system.css?v=20261109-modal-center-1");
/* ========================================================================== 
   BERURI — PADRÃO VISUAL ÚNICO DOS PORTAIS
   --------------------------------------------------------------------------
   Este arquivo é o MESMO nas três pastas: /online, /trans e /licitacao.
   Ele existe para que os três tenham a mesma cara: mesma cor, mesma fonte,
   mesma largura, mesmas tabelas, mesmos botões.

   Como funciona: o arquivo é carregado por último em cada página, então o que
   está aqui vence o estilo antigo da página. Para desfazer tudo, basta apagar
   a linha <link ... beruri-padrao.css> das páginas — nada mais é alterado.

   O que ele NÃO mexe: banner, menu abaixo do banner, mapa do site no rodapé
   e a barra de acessibilidade. Esses continuam exatamente como estão.

   Versão 1.0 — 30/09/2026
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. AS CORES OFICIAIS DE BERURI
   Conferidas no site oficial em 01/10/2026, abrindo
   acs-am.com.br/transparencia/ e lendo as cores que ele realmente usa.
   -------------------------------------------------------------------------- */
:root{
  --bru-verde-escuro:#1b5e20;   /* a cor principal do site: cabeçalho, menu, títulos */
  --bru-verde:#2e7d32;          /* links e foco do teclado */
  --bru-verde-medio:#a5d6a7;    /* o verde claro dos rótulos "CATEGORIA N" */
  --bru-verde-claro:#e8f5e9;    /* fundo de linha destacada e bordas dos cartões */
  --bru-verde-borda:#e8f5e9;    /* bordas (o site usa o mesmo tom) */
  --bru-dourado:#e8b923;        /* detalhe e marca-texto da busca */
  --bru-creme:#f6ecd9;          /* fundo dos avisos */
  --bru-vermelho:#a4222c;       /* erros */
  /* O branco dos cartoes, tabelas e campos. Estava sendo usada em tres
     lugares do arquivo sem nunca ter sido definida, o que fazia o fundo
     desses elementos virar transparente. Acertado em 06/10/2026. */
  --bru-card:#ffffff;
  --bru-texto:#272626;          /* texto comum, como no site */
  --bru-muted:#546e7a;          /* texto secundário */
  --bru-fundo:#f1f8f2;          /* fundo da página */
  --bru-largura:1280px;         /* largura institucional dos portais */
  --bru-raio:14px;              /* o arredondamento dos cartões do site */
  --bru-fonte:Roboto,"Segoe UI",-apple-system,BlinkMacSystemFont,Arial,Helvetica,sans-serif;
  --bru-sombra:0 2px 10px rgba(27,94,32,.07);   /* a sombra exata dos cartões */
  --bru-sombra-alta:0 6px 18px rgba(27,94,32,.13);
}

/* --------------------------------------------------------------------------
   2. BASE DA PÁGINA
   -------------------------------------------------------------------------- */
html{
  min-height:100%;
  overflow-y:auto;
}
body{
  min-height:100%;
  height:auto;
  overflow-y:auto;
  font-family:var(--bru-fonte);
  color:var(--bru-texto);
  background:var(--bru-fundo);
  line-height:1.7;
  -webkit-text-size-adjust:100%;
}

.b-search-overlay,
#b-search-overlay,
.md-overlay{
  overflow-y:auto;
  overscroll-behavior:contain;
}

/* Nenhum texto abaixo de 14px: é o mínimo confortável para leitura. */
body, p, li, td, th, label, input, select, textarea, button{font-size:max(1em,14px);}

/* Só a forma do título é padronizada (fonte, tamanho, espaçamento).
   A COR de cada título continua sendo a da própria página — porque muitos
   deles ficam dentro de faixas verdes escuras, onde o texto precisa ser
   branco. Forçar a cor aqui deixaria esses títulos invisíveis. */
h1,h2,h3,h4,h5,h6{
  font-family:var(--bru-fonte);
  line-height:1.25;
  text-wrap:balance;
}
/* A escala do site: h1 de 48px e h2 de 32px nas telas grandes, encolhendo
   sozinhos no celular. O peso 900 do h1 é o do site. */
h1{font-size:clamp(1.6rem,1.1rem + 1.9vw,3rem); font-weight:900;}
h2{font-size:clamp(1.25rem,1rem + 1.1vw,2rem); font-weight:700;}
h3{font-size:clamp(1.05rem,.95rem + .4vw,1.3rem); font-weight:700;}

/* A cor dos links também fica por conta de cada página, pelo mesmo motivo
   dos títulos: há links brancos sobre faixa verde que sumiriam. */

/* --------------------------------------------------------------------------
   3. FOCO VISÍVEL — exigência de acessibilidade (e-MAG / WCAG 2.1)
   Quem navega por teclado precisa enxergar onde está. Antes disso, duas das
   três pastas não mostravam nada ao tabular.
   -------------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid var(--bru-verde);
  outline-offset:2px;
  border-radius:4px;
}

/* Link "pular para o conteúdo": invisível até alguém tabular. */
.bru-pular{
  position:absolute; left:-9999px; top:0; z-index:9999;
  background:var(--bru-verde-escuro); color:#fff;
  padding:12px 20px; border-radius:0 0 var(--bru-raio) 0;
  font-weight:600; text-decoration:none;
}
.bru-pular:focus{left:0;}

/* --------------------------------------------------------------------------
   4. LARGURA DO CONTEÚDO — a mesma nos três portais
   -------------------------------------------------------------------------- */
.container,
.conteudo,
main,
[role="main"],
.wrap,
.wrapper,
.bru-largura{
  max-width:var(--bru-largura);
  margin-left:auto;
  margin-right:auto;
}

/* --------------------------------------------------------------------------
   5. TABELAS — onde o cidadão realmente lê os dados
   Cabeçalho que não some ao rolar, linhas alternadas, e rolagem lateral no
   celular em vez de a tabela estourar a tela.
   -------------------------------------------------------------------------- */
table:not(#bm-site-footer table, #b-toolbar table){
  width:100%;
  border-collapse:collapse;
  background:var(--bru-card);
  font-variant-numeric:tabular-nums;   /* números alinham na vertical */
}
table:not(#bm-site-footer table) thead th{
  position:sticky; top:0; z-index:1;
  background:var(--bru-verde-escuro);
  color:#fff;
  text-align:left;
  font-weight:600;
  padding:11px 12px;
  white-space:nowrap;
}
table:not(#bm-site-footer table) tbody td{
  padding:10px 12px;
  border-bottom:1px solid var(--bru-verde-borda);
  vertical-align:top;
}
table:not(#bm-site-footer table) tbody tr:nth-child(even){background:#fafcfa;}
table:not(#bm-site-footer table) tbody tr:hover{background:var(--bru-verde-claro);}

/* Valores em dinheiro e datas ficam melhor à direita. */
td.valor, td.numero, th.valor, th.numero,
td[data-tipo="valor"], td[data-tipo="numero"]{
  text-align:right; white-space:nowrap;
}

/* No celular a tabela rola de lado em vez de espremer as colunas. */
.tabela-rolagem, .table-responsive, .tabela-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:var(--bru-raio);
  border:1px solid var(--bru-verde-borda);
}

/* Destaque da busca — o texto achado. */
mark{background:var(--bru-dourado); color:var(--bru-texto); padding:0 2px; border-radius:3px;}

/* --------------------------------------------------------------------------
   6. CAIXAS, FILTROS E CARTÕES
   -------------------------------------------------------------------------- */
.card, .cartao, .caixa, .painel, .filtros-card, .bloco, section.card, .tp-card{
  background:var(--bru-card);
  border:1px solid var(--bru-verde-borda);
  border-radius:var(--bru-raio);
  box-shadow:var(--bru-sombra);
  padding:20px;                 /* a medida do site */
}
/* O rótulo pequeno em verde claro sobre o título, como "CATEGORIA 3". */
.bru-etiqueta{display:block; font-size:.72rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--bru-verde-medio); margin-bottom:6px;}

/* --------------------------------------------------------------------------
   7. BOTÕES E CAMPOS
   O :not(...) abaixo protege três coisas que você pediu para manter como
   estão: a barra de acessibilidade, o menu abaixo do banner e o mapa do site
   no rodapé. Nada dentro delas é alterado por este arquivo.
   -------------------------------------------------------------------------- */
:is(button, .botao, .btn, input[type="submit"], input[type="button"]):not(
  #b-toolbar *, #bm-site-footer *, .menu-site-principal *, #b-search-overlay *){
  font-family:var(--bru-fonte);
  font-weight:600;
  border-radius:8px;
  cursor:pointer;
  min-height:40px;              /* alvo de toque confortável no celular */
  padding:9px 16px;
  transition:background .15s, box-shadow .15s;
}
button:disabled, .botao:disabled, .btn:disabled{opacity:.55; cursor:not-allowed;}

:is(input, select, textarea):not(
  #b-toolbar *, #bm-site-footer *, .menu-site-principal *, #b-search-overlay *,
  .seletor-ano *){
  font-family:var(--bru-fonte);
  color:var(--bru-texto);
  background:var(--bru-card);
  border:1px solid var(--bru-verde-borda);
  border-radius:8px;
  padding:9px 11px;
  min-height:40px;
}
input::placeholder, textarea::placeholder{color:var(--bru-muted); opacity:1;}

/* --------------------------------------------------------------------------
   8. AVISOS
   -------------------------------------------------------------------------- */
.aviso, .alerta, .aviso-fonte{
  background:var(--bru-creme);
  border:1px solid var(--bru-dourado);
  border-radius:var(--bru-raio);
  padding:12px 16px;
}
.erro, .mensagem-erro{
  background:#fdecee;
  border:1px solid var(--bru-vermelho);
  color:var(--bru-vermelho);
  border-radius:var(--bru-raio);
  padding:12px 16px;
}

/* --------------------------------------------------------------------------
   9. CELULAR
   -------------------------------------------------------------------------- */
@media (max-width:640px){
  body{line-height:1.55;}
  thead th, tbody td{padding:9px 10px;}
  .container, .conteudo, main, [role="main"]{padding-left:14px; padding-right:14px;}
  button, .botao, .btn{width:auto; min-height:44px;}
}

/* --------------------------------------------------------------------------
   10. QUEM PEDE MENOS ANIMAÇÃO (acessibilidade)
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* --------------------------------------------------------------------------
   11. IMPRESSÃO — o cidadão costuma imprimir a consulta
   -------------------------------------------------------------------------- */
@media print{
  body{background:#fff; color:#000; font-size:11pt;}
  .menu-site-principal, #b-toolbar, #bm-site-footer, .filtros,
  .paginacao, button, .botao, .btn, .voltar, .voltar-padrao, nav{display:none !important;}
  table{page-break-inside:auto;}
  thead{display:table-header-group;}       /* cabeçalho repete a cada página */
  tr{page-break-inside:avoid;}
  thead th{background:#eee !important; color:#000 !important; -webkit-print-color-adjust:exact;}
  a[href]::after{content:" (" attr(href) ")"; font-size:9pt; color:#555;}
}

/* ===========================================================================
   Seletores de Exercício e Mês do cabeçalho — legibilidade   (06/10/2026)
   ---------------------------------------------------------------------------
   O PROBLEMA
   As páginas definem, no seu próprio <style>:

       .seletor-ano select        { background: rgba(255,255,255,.15); color:#fff }
       .seletor-ano select option { color:#26332c }

   A intenção era texto branco no controle fechado e texto escuro na lista
   aberta. Só que o Chrome pinta o controle FECHADO com a cor da opção
   selecionada — ou seja, com o #26332c. Resultado: cinza-escuro sobre o verde
   escuro do cabeçalho, quase ilegível. Conferido no site ao vivo, não só no
   navegador de teste.

   A SOLUÇÃO
   Inverter: fundo branco com texto verde escuro, igual aos filtros de dentro
   das abas. Fica legível fechado E aberto, sem depender de como cada navegador
   decide pintar o controle fechado.

   Vale para os dois seletores do cabeçalho — o de Exercício, que já existia, e
   o de Mês, criado nesta data.
   =========================================================================== */
header .seletor-ano select,
.seletor-ano select{
  background:#fff;
  color:var(--bru-verde-escuro,#1b5e20);
  border:1px solid rgba(255,255,255,.7);
  font-weight:600;
}
header .seletor-ano select option,
.seletor-ano select option{
  background:#fff;
  color:#26332c;
  font-weight:400;
}
/* Mês desligado: nas páginas cujos dados não são separados por mês
   (licitações, contratos, receita orçamentária). Continua legível, mas
   visivelmente fora de uso. */
header .seletor-ano select:disabled,
.seletor-ano select:disabled{
  background:rgba(255,255,255,.55);
  color:#51635a;
  cursor:not-allowed;
}
header .seletor-ano label,
.seletor-ano label{ color:#fff; }

/* ========================================================================== 
   12. ACABAMENTO INSTITUCIONAL E DADOS SEM RECORTE — 27/10/2026
   ========================================================================== */
body > img[alt*="Banner institucional"],
.banner-wrap img{
  display:block;
  width:100%;
  max-width:none;
  height:auto;
  max-height:none;
  min-height:0;
  margin-inline:auto;
  object-fit:contain;
  object-position:center;
  box-sizing:border-box;
}
.banner-wrap{background:#f6ecd9;text-align:center;overflow:hidden}
@media(max-width:680px){
  body > img[alt*="Banner institucional"],.banner-wrap img{height:auto;min-height:0;max-height:none;object-fit:contain}
}
.tp-hero{
  background:linear-gradient(135deg,var(--bru-verde),var(--bru-verde-escuro));
  border:1px solid var(--bru-verde-escuro);
  box-shadow:var(--bru-sombra-alta);
}
.anc-online-skip{
  position:fixed;
  z-index:100001;
  top:7px;
  left:-9999px;
  padding:10px 16px;
  border-radius:8px;
  background:#fff;
  color:var(--bru-verde-escuro)!important;
  font-weight:800;
  text-decoration:none!important;
  box-shadow:0 5px 18px rgba(0,0,0,.28);
}
.anc-online-skip:focus{left:8px;}
.tp-botoes a:hover,.tp-botoes a:focus-visible{
  background:#fff;
  color:var(--bru-verde-escuro);
}
.trilha{
  max-width:var(--bru-largura);
  margin:14px auto 0;
  padding:9px 16px;
  border:1px solid var(--bru-verde-borda);
  border-radius:10px;
  background:#fff;
  color:var(--bru-muted);
  font-size:.86rem;
}

.explicacao{
  margin:0 0 18px;
  padding:16px 18px;
  border:1px solid var(--bru-verde-borda);
  border-left:5px solid var(--bru-verde-escuro);
  border-radius:0 var(--bru-raio) var(--bru-raio) 0;
  background:#fff;
  box-shadow:var(--bru-sombra);
}
.explicacao > :first-child{margin-top:0;}
.explicacao > :last-child{margin-bottom:0;}

.cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:14px;
  margin:16px 0 20px;
}
.cards > .card{
  min-width:0;
  margin:0;
  border-top:4px solid var(--bru-verde-escuro);
}
.cards > .card .rotulo{
  color:var(--bru-muted);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.cards > .card .valor{
  margin-top:5px;
  color:var(--bru-verde-escuro);
  font-size:clamp(1.15rem,1rem + .7vw,1.65rem);
  font-weight:800;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.cards > .card .sub{color:var(--bru-muted);font-size:.84rem;}

.painel{
  margin:0 0 18px;
  border-top:3px solid var(--bru-verde-escuro);
}
.filtros-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;
  align-items:end;
}
.filtro,.busca-wrap{min-width:0;}
.filtro label{display:block;margin-bottom:5px;color:var(--bru-verde-escuro);font-weight:700;}
.acoes-filtro{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}

.tp-card{
  min-height:190px;
  border-top:4px solid var(--bru-verde-escuro);
}
.tp-card .tp-desc{
  display:block;
  max-height:none;
  overflow:visible;
  white-space:normal;
  text-overflow:clip;
  overflow-wrap:anywhere;
}

.tabela-wrap{
  max-width:100%;
  overflow:auto;
  scrollbar-color:var(--bru-verde-escuro) #e7efe9;
  scrollbar-width:auto;
  scrollbar-gutter:stable;
}
.tabela-wrap::-webkit-scrollbar{height:14px;width:14px;}
.tabela-wrap::-webkit-scrollbar-track{background:#e7efe9;border-radius:10px;}
.tabela-wrap::-webkit-scrollbar-thumb{background:var(--bru-verde-escuro);border:3px solid #e7efe9;border-radius:10px;}
.tabela-wrap td{
  max-width:none;
  overflow:visible;
  white-space:normal;
  text-overflow:clip;
  overflow-wrap:anywhere;
}
.tabela-wrap td a{overflow-wrap:anywhere;}

@media (max-width:640px){
  .trilha{margin-left:14px;margin-right:14px;}
  .cards{grid-template-columns:1fr;}
  .tp-card{min-height:0;}
  .acoes-filtro > *{flex:1 1 150px;}
}

/* ========================================================================== 
   13. NAVEGAÇÃO DO ONLINE POR CARDS
   ========================================================================== */
.anc-online-card-navigation{
  width:min(var(--bru-largura),100%);
  margin:20px auto;
  padding:0 20px;
}
.anc-online-card-heading{
  margin:0 0 10px;
  color:var(--bru-verde-escuro);
  font-size:clamp(1.05rem,.96rem + .35vw,1.3rem);
  font-weight:850;
}
.anc-online-card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:12px;
}
.anc-online-nav-card{
  display:flex;
  min-width:0;
  min-height:94px;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border:1px solid var(--bru-verde-borda);
  border-top:4px solid var(--bru-verde-escuro);
  border-radius:var(--bru-raio);
  background:var(--bru-card);
  color:var(--bru-texto)!important;
  text-decoration:none!important;
  box-shadow:var(--bru-sombra);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.anc-online-nav-card:hover,
.anc-online-nav-card:focus-visible{
  transform:translateY(-2px);
  border-color:var(--bru-verde);
  box-shadow:var(--bru-sombra-alta);
  outline:none;
}
.anc-online-nav-card:focus-visible{outline:3px solid var(--bru-dourado);outline-offset:3px;}
.anc-online-nav-card[aria-current="page"]{
  background:var(--bru-verde-escuro);
  border-color:var(--bru-verde-escuro);
  color:#fff!important;
}
.anc-online-nav-icon{
  display:grid;
  width:44px;
  height:44px;
  flex:0 0 44px;
  place-items:center;
  border-radius:12px;
  background:var(--bru-verde-claro);
  font-size:1.5rem;
}
.anc-online-nav-card[aria-current="page"] .anc-online-nav-icon{background:rgba(255,255,255,.18);}
.anc-online-nav-copy{display:flex;min-width:0;flex-direction:column;line-height:1.25;}
.anc-online-nav-copy strong{font-size:.96rem;overflow-wrap:anywhere;}
.anc-online-nav-copy small{margin-top:5px;color:var(--bru-muted);font-size:.79rem;line-height:1.35;overflow-wrap:anywhere;}
.anc-online-nav-card[aria-current="page"] .anc-online-nav-copy small{color:#e7f5e9;}

nav.menu-despesas.anc-online-card-tabs{
  display:grid;
  width:min(var(--bru-largura),calc(100% - 40px));
  max-width:var(--bru-largura);
  grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
  gap:10px;
  margin:10px auto 20px;
  padding:0;
}
nav.menu-despesas.anc-online-card-tabs button[role="tab"]{
  display:flex;
  min-width:0;
  min-height:72px;
  align-items:center;
  gap:9px;
  justify-content:flex-start;
  padding:12px 14px;
  border:1px solid var(--bru-verde-borda);
  border-left:4px solid var(--bru-verde-escuro);
  border-radius:12px;
  background:#fff;
  color:var(--bru-verde-escuro);
  box-shadow:var(--bru-sombra);
  text-align:left;
  line-height:1.25;
}
nav.menu-despesas.anc-online-card-tabs button[role="tab"]:hover,
nav.menu-despesas.anc-online-card-tabs button[role="tab"]:focus-visible{
  background:var(--bru-verde-claro);
  border-color:var(--bru-verde);
  outline:none;
  box-shadow:var(--bru-sombra-alta);
}
nav.menu-despesas.anc-online-card-tabs button[role="tab"]:focus-visible{outline:3px solid var(--bru-dourado);outline-offset:2px;}
nav.menu-despesas.anc-online-card-tabs button[role="tab"].ativo,
nav.menu-despesas.anc-online-card-tabs button[role="tab"][aria-selected="true"]{
  background:var(--bru-verde-escuro);
  border-color:var(--bru-verde-escuro);
  color:#fff;
}
.anc-online-tab-icon{font-size:1.35rem;line-height:1;}
.anc-online-tab-title{font-weight:800;overflow-wrap:anywhere;}

@media (max-width:720px){
  .anc-online-card-navigation{padding:0 14px;}
  .anc-online-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  nav.menu-despesas.anc-online-card-tabs{width:calc(100% - 28px);grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:480px){
  .anc-online-card-grid,
  nav.menu-despesas.anc-online-card-tabs{grid-template-columns:1fr;}
  .anc-online-nav-card{min-height:0;}
}

/* Exportação pública: formatos alinhados, legíveis e responsivos. */
.grupo-exportar{
  display:inline-flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:10px!important;
}
.grupo-exportar :is(button,a){
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-height:48px!important;
  margin:0!important;
  padding:10px 18px!important;
  border:1px solid var(--bru-verde-escuro,#1b5e20)!important;
  border-radius:9px!important;
  background:var(--bru-verde-escuro,#1b5e20)!important;
  color:#fff!important;
  font-size:.92rem!important;
  font-weight:750!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  box-shadow:none!important;
}
.grupo-exportar :is(button,a):hover{background:#124b1a!important;border-color:#124b1a!important}
.grupo-exportar :is(button,a):focus-visible{outline:3px solid #f4c542!important;outline-offset:2px!important}
@media(max-width:560px){.grupo-exportar{display:flex!important}.grupo-exportar :is(button,a){flex:1 1 145px!important}}