# Menu de Serviços

Este documento descreve a estrutura, estilos, acessibilidade e responsividade do menu de Serviços no GestorEasy.

## Estrutura
- Local: `views/_layout.php`, seção de navegação principal.
- Itens:
  - `Dashboard de Serviços` (`/servicos/dashboard`)
  - `Veículos` (`/servicos/veiculos`)
  - `Ordens de Serviço` (`/servicos/ordens`)
  - `Checklists` (`/servicos/checklists`)
  - `Documentos` (`/servicos/documentos`)
  - `Relatórios de Serviços` (`/servicos/relatorios`)
- Controle de acesso: o bloco de Serviços possui `data-required-perm="servicos.read"`. O mecanismo global oculta itens/grupos caso o usuário não possua a permissão (ou se não for admin/impersonated).

## Estilo e Tokens
- Usa `theme.css` para cores e tokens: `--color-orange`, `--color-olive`, `--text-on-light`, `--border-muted`.
- Estados:
  - Hover: leve realce (`#f3f4f6`).
  - Focus: `outline: 2px solid var(--color-olive)` com `outline-offset: 2px`.
  - Active: fundo `var(--color-orange)` e texto branco em itens; o botão do grupo também recebe `.active`.
- Tipografia: sistema (`-apple-system`, `Segoe UI`, `Roboto`) com suavização e espaçamento consistente.

## Ícones
- Unificados via SVG inline com injeção automática baseada no texto do item.
- Mapeamento dos itens de Serviços adicionado no `iconMap(name)`.
- Evita imagens externas e garante coerência visual em tema claro/escuro.

## Acessibilidade
- ARIA:
  - `role="menubar"` na barra principal.
  - `aria-haspopup="true"` e `aria-expanded` nos botões dos grupos.
  - `role="menu"` nas listas; `role="menuitem"` nos itens.
- Teclado:
  - `Enter`/`Espaço` abre o menu e foca o primeiro item.
  - `ArrowUp`/`ArrowDown` navega entre itens.
  - `Home`/`End` vai ao primeiro/último item.
  - `Esc` fecha e retorna o foco ao botão do grupo.

## Responsividade
- Até `768px`: o dropdown torna-se estático (sem posição absoluta) e preserva acessibilidade.
- Hit areas: padding e espaçamento consistentes para toque.

## Comportamento de Ativo
- O item correspondente à rota atual recebe `.active`.
- O botão do grupo recebe `.active` quando a rota pertence ao grupo (ex.: rotas `/servicos/*`).

## Manutenção
- Adicionar novos itens de Serviços: incluir o link em `views/_layout.php` e, opcionalmente, mapear no `iconMap(name)`.
- Permissão: ajustar `data-required-perm` se necessário.

## Testes Visuais
- Iniciar servidor local (`php -S 127.0.0.1:8000 -t public public/router.php`).
- Autenticar para visualizar o menu (sem token, navegação redireciona para `/login`).

## Seed de Serviços
- Para popular dados de exemplo, use o script CLI descrito em `docs/servicos-seed.md`. O endpoint HTTP de seed foi removido.