# Rotas Ativas — Scroll Interno do Painel

**Data:** 2026-06-22  
**Arquivo alvo:** `componentes/Missoes/Logistica/sinais/Central/html/central.php`  
**Escopo:** CSS/layout only — sem backend, sem alteração de JS

---

## Problema

O wrapper da tabela no painel `#rotas-summary-panel` tem `max-h-[350px]`, o que equivale a ~10 linhas de ~35px cada. Com mais de 10 rotas ativas, o conteúdo fica oculto e o usuário precisa reduzir o zoom do mapa para visualizar as rotas extras.

## Solução

Dois pontos de mudança em `central.php`:

### 1. Painel externo (linha ~3570)

Adicionar `flex flex-col` às classes Tailwind e adicionar `max-height: calc(100vh - 120px)` ao style inline.

O valor `120px` = `100px` (margin-top do painel) + `20px` (folga de respiro na borda inferior).

```html
<!-- ANTES -->
<div id="rotas-summary-panel"
     style="margin-top:100px;"
     class="fixed left-5 z-30 g-painel-flutuante max-w-[420px]">

<!-- DEPOIS -->
<div id="rotas-summary-panel"
     style="margin-top:100px; max-height:calc(100vh - 120px);"
     class="fixed left-5 z-30 g-painel-flutuante max-w-[420px] flex flex-col">
```

### 2. Wrapper da tabela (linha ~3574)

Substituir `max-h-[350px] overflow-y-auto` por `flex-1 min-h-0 overflow-y-auto`.

- `flex-1` → cresce para preencher o espaço vertical disponível dentro do painel
- `min-h-0` → necessário para que flex-children comprimir corretamente (sem ele o navegador ignora o `overflow-y: auto`)

```html
<!-- ANTES -->
<div class="max-h-[350px] overflow-y-auto">

<!-- DEPOIS -->
<div class="flex-1 min-h-0 overflow-y-auto">
```

## Comportamento após a mudança

| Situação | Comportamento |
|---|---|
| ≤ 10 rotas | Painel cresce naturalmente com o conteúdo (altura < limite da viewport) |
| > 10 rotas | Tabela rola internamente; filtros e botão Portaria ficam fixos na base do painel |
| Modo recolhido (`isRotasTableCollapsed`) | Mesmo comportamento vertical; apenas a largura é afetada pelo JS existente |
| Resize da janela | `calc(100vh - 120px)` recalcula automaticamente pelo navegador |

## Elementos não afetados

- **`.g-painel-flutuante-header`** — vira flex-sibling `shrink-0` automaticamente; sem mudança de código.
- **`#special-filters-container`** — idem; permanece ancorado abaixo da tabela.
- **`#btn-alerta-portaria`** — idem.
- **`maps.js:updateRotasSummaryTable()`** — controla apenas largura; não precisa de alteração.

## Fora do escopo

- Central2 (`central2.php`) — não possui este painel ainda.
- Paginação ou virtualização da tabela — desnecessário para o volume esperado de rotas.
- Redimensionamento manual (drag-to-resize) do painel.