/* O menu partilhado. ⚠️ Computador primeiro; no telemóvel arrasta-se de lado. */

.bu-menu {
  display: flex; align-items: center; gap: 18px;
  padding: 0 24px; height: 46px;
  background: #1a1a1a; color: #fff;
  font: 15px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  position: sticky; top: 0; z-index: 20;
}
.bu-menu__marca { font-weight: 700; letter-spacing: .02em; flex: 0 0 auto; }
.bu-menu__itens {
  display: flex; gap: 4px; flex: 1 1 auto;
  overflow-x: auto; scrollbar-width: none;
}
.bu-menu__itens::-webkit-scrollbar { display: none; }

.bu-menu__item {
  color: rgba(255, 255, 255, .72); text-decoration: none;
  padding: 7px 12px; border-radius: var(--ilha-raio-pastilha);
  white-space: nowrap; flex: 0 0 auto;
}
a.bu-menu__item:hover { color: #fff; background: rgba(255, 255, 255, .1); }
/* ⚠️ O ecrã onde se está fica marcado e NÃO é clicável. */
.bu-menu__item.e-atual { color: #fff; background: var(--ilha-cor); font-weight: 600; }

.bu-menu__sair { color: rgba(255, 255, 255, .55); text-decoration: none; font-size: 14px; flex: 0 0 auto; }
.bu-menu__sair:hover { color: #fff; }

/* ⚠️ Os topos dos painéis eram `sticky top:0`. Com o menu por cima, colavam por baixo dele. */
.ve-topo { top: 46px; }

@media (max-width: 760px) {
  .bu-menu { padding: 0 14px; gap: 12px; }
  .bu-menu__marca { display: none; }   /* o espaço faz falta para os itens */
  .ve-topo { top: 46px; }
}

/* O botão de exportar, no topo de cada painel. */
.bu-exportar {
  font: inherit; font-size: 15px; padding: 7px 14px; cursor: pointer;
  border: 1px solid var(--ilha-linha-forte); border-radius: var(--ilha-raio-pastilha);
  background: #fff; color: inherit; white-space: nowrap; flex: 0 0 auto;
}
.bu-exportar:hover { background: var(--ilha-fundo-suave); }

/* ═══════════════════════════════════════════════════════════════════════════
   O PERÍODO, ESCOLHIDO UMA VEZ (12/08/2026, pedido do Silva)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ⚠️ `display:none` e NÃO o atributo `hidden`: nesta casa o `hidden` já falhou a esconder
   sete abas durante meses, porque havia um `display` declarado a ganhar-lhe. */
nav.e-conduzido { display: none !important; }

.bu-periodo {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: 6px;
  flex-wrap: wrap;
  padding: 8px 12px;
  background: var(--ilha-fundo, #fff);
  border-bottom: 1px solid var(--ilha-linha);
}
.bu-periodo__etiqueta {
  font-size: 12px; text-transform: uppercase; letter-spacing: .05em;
  color: var(--ilha-apagado); font-weight: 600; margin-right: 2px;
}
.bu-periodo button {
  /* ⚠️ 16px mínimo e alvo de 44px: isto usa-se no telemóvel, ao balcão, com pressa. */
  font: inherit; font-size: 16px;
  min-height: 44px; padding: 0 14px;
  border: 1px solid var(--ilha-linha); border-radius: 999px;
  background: transparent; color: inherit; cursor: pointer;
}
.bu-periodo button.e-ativo {
  background: var(--ilha-cor1, #9727B3); color: #fff; border-color: transparent;
}

/* ⚠️⚠️ OS ECRÃS DO MOLDE ANTIGO TAPAVAM O MENU.
   `.ilha-ecra { position: fixed; inset: 0 }` ocupa a janela toda e fica por cima do menu, que
   está desenhado mas não se consegue tocar. Foi assim que o Silva ficou preso nas Faturas sem
   conseguir voltar. A altura vem medida do `menu.js` — escrita à mão, partia-se no telemóvel,
   onde o menu quebra em duas linhas. */
.ilha-ecra { top: var(--bu-topo, 0px); }
/* ⚠️ O `--ilha-camada-ecra` é 2147483001. Um z-index de 2000 ficava MUITO abaixo dele e o
   menu continuava tapado. A camada do menu tem de ser maior do que a do ecrã. */
.bu-menu, .bu-periodo { position: relative; z-index: 2147483002; }