> For the complete documentation index, see [llms.txt](https://digitalsac.gitbook.io/digicrm/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://digitalsac.gitbook.io/digicrm/digicrm/operacao-uso-do-sistema/configuracoes/configuracoes-gerais/personalizacao.md).

# Personalização

**Caminho:** Configurações → Gerais → aba **Personalização**

\[\[FOTO]]

### 17. Personalização → Aparência (`appearance`)

Título: **Customização de Imagens e Cores do Sistema**

#### Logos

| Campo                    | Chave                | Para que serve                                              |
| ------------------------ | -------------------- | ----------------------------------------------------------- |
| Logo (Modo Claro) - URL  | `tenantLogoLightUrl` | URL externa do logo claro (pós-login). Vazio = logo padrão. |
| Logo (Modo Escuro) - URL | `tenantLogoDarkUrl`  | Idem para escuro.                                           |

#### Wallpapers do chat

| Campo                            | Chave                | Para que serve                                     |
| -------------------------------- | -------------------- | -------------------------------------------------- |
| Imagem de fundo do Chat (Claro)  | `chatWallpaperLight` | Upload imagem (máx. 5 MB) em base64, ou `default`. |
| Imagem de fundo do Chat (Escuro) | `chatWallpaperDark`  | Idem. Recomendação: proporção 16:9.                |

#### Menu / UI

| Campo                               | Chave                     | Para que serve                                                       |
| ----------------------------------- | ------------------------- | -------------------------------------------------------------------- |
| Habilitar Cores Personalizadas      | `customColorsEnabled`     | `enabled`/`disabled`. Liga personalização de cores do menu.          |
| Ocultar Subtítulos do Menu          | `hideMenuSubtitles`       | `enabled`/`disabled`. Esconde subtítulos/descrições do menu lateral. |
| Desativar Botão SIP Webphone (Beta) | `hideSipWebphoneButton`   | `enabled`/`disabled`. Oculta botão SIP na barra superior.            |
| Background do Menu                  | `menuBackgroundColor`     | Cor de fundo (claro).                                                |
| Background do Menu (Escuro)         | `menuBackgroundColorDark` | Cor de fundo (escuro).                                               |
| Cor do Título                       | `menuTitleColor`          | Títulos dos itens (claro).                                           |
| Cor do Título (Escuro)              | `menuTitleColorDark`      | Idem escuro.                                                         |
| Cor do Subtítulo                    | `submenuTitleColor`       | Subtítulos (claro).                                                  |
| Cor do Subtítulo (Escuro)           | `submenuTitleColorDark`   | Idem escuro.                                                         |
| Hover do Menu (opacidade → RGBA)    | `menuHoverColor`          | Slider de opacidade gera `rgba(255,255,255, opacity)`.               |
| Hover do Menu (Escuro)              | `menuHoverColorDark`      | Idem modo escuro.                                                    |

Botões: Aplicar AGORA · Salvar & Aplicar (aplicam CSS variables / layout).

***

### 18. Personalização → Menu Lateral (`menu-lateral`)

Componente: `ConfiguracoesMenuLateral.vue` → `MenuBuilder`. Persistência agregada na chave **`menuLayoutConfig`** (JSON via store `menuConfig`).

| Área               | Chave                          | Para que serve                                                                                                                                                                   |
| ------------------ | ------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Modelo do menu     | (dentro de `menuLayoutConfig`) | `legacy` = modelo antigo; `modern` = configurável.                                                                                                                               |
| Visibilidade       | idem                           | Toggles: logo, tema, rótulos de seção, links externos, bloco do usuário (avatar, status, saudação, nome, perfil, tenant, ações), posição topo/rodapé, status do sistema, versão. |
| Tipografia         | idem                           | Fonte, peso do item ativo, tamanhos de item/grupo/nome.                                                                                                                          |
| Dimensões          | idem                           | Largura aberta/recolhida, arredondamento, separadores, iniciar recolhido.                                                                                                        |
| Cores claro/escuro | idem                           | Fundo, texto, ativo, hover, ícones, header/footer, bordas, rótulos; paletas predefinidas.                                                                                        |
| Estrutura do menu  | idem                           | Itens/grupos: título, rota, ícone, visibilidade, ordem (drag), subitens, cor de ícone.                                                                                           |
| Pré-visualização   | —                              | Expandido/recolhido (sempre no modelo novo).                                                                                                                                     |
| Ações              | —                              | Salvar · Descartar · Restaurar padrão.                                                                                                                                           |

***

### Valores comuns de tempo (`tempoOptions`)

Usados em `autoCloseTime` e `autoInactiveChatTime`:

| Valor (minutos) | Label      |
| --------------- | ---------- |
| `1`             | 1 minuto   |
| `10`            | 10 minutos |
| `30`            | 30 minutos |
| `60`            | 1 hora     |
| `120`           | 2 horas    |
| `240`           | 4 horas    |
| `480`           | 8 horas    |
| `960`           | 12 horas   |
| `1380`          | 23 horas   |
| `1440`          | 1 dia      |
| `7200`          | 5 dias     |
| `14400`         | 10 dias    |

***

### Fontes

* UI: `/home/deploy/DigitalSac/frontend/src/pages/configuracoes/ConfiguracoesGerais.vue`
* Filhos: `ConfiguracoesSons.vue`, `ConfiguracoesWhatsMeow.vue`, `ConfiguracoesDigiApi.vue`, `ConfiguracoesHubPay.vue`, `ConfiguracoesDigiCalls.vue`, `ConfiguracoesMenuLateral.vue` + `components/settings/MenuBuilder.vue`
* i18n PT: `/home/deploy/DigitalSac/frontend/src/locales/pt-BR.json` → `configuracoes.general`, `configuracoes.sons|whatsmeow|digiapi|hubpay|digicalls`, `menuBuilder`