ajustes de memoria

global/rules/estilos-design-system

@@ -4,7 +4,7 @@ name: estilos-design-system
 description: Define os dois design systems do ecossistema e-licencie — Floreta (iniciativa privada) e Betha (governo) — e quando usar cada um
 scope: global
 trigger: always
-updatedAt: "2026-07-01"
+updatedAt: "2026-07-02"
 ---
 
 # Regra: Estilos e Design Systems do Ecossistema
@@ -110,15 +110,96 @@ Usado em: aplicações integradas à plataforma Betha (gestão municipal, e-Gov)
 - Interfaces que operam dentro do ecossistema e-Gov Betha
 - Aplicações web com `body class="suite-pla iv"`
 
+### Tokens Reais — Ecossistema GOV (React/MUI)
+
+Os frontends React (QUIPO-FRONT, QUIPO-PORTAL3, AUTENTICACAO-FRONT) usam estes tokens via MUI ThemeProvider:
+
+| Token | Hex | Uso |
+|-------|-----|-----|
+| primary | `#007bff` | botões, links, destaques |
+| primary dark | `#0069d9` | hover de botões primários |
+| secondary | `#6c757d` | ações secundárias |
+| dark (header) | `#343a40` | header de telas, DialogTitle, navbar |
+| body bg | `#EBEDF0` | background da aplicação |
+| light bg | `#f8f9fa` | DialogActions, cards neutros |
+| border | `#dee2e6` | bordas de separadores |
+| text | `#212529` | texto principal |
+| text muted | `#495057` | texto secundário/labels |
+| success | `#28a745` | status positivo |
+| danger | `#dc3545` | erro/exclusão |
+| warning | `#ffc107` | alerta |
+| info | `#17a2b8` | informação |
+| e-licencie primary | `#688c00` | substituição de primary quando marca e-licencie ativa |
+
+**Seleção de itens (cartões interativos):**
+- Selecionado: `#cce5ff` / hover: `#b8daff`
+- Não selecionado: `#f8f9fa` / hover: `#e9ecef`
+
+### Vue 3 + Vuetify — QUIPO-CONSOLE
+
+O QUIPO-CONSOLE usa Vue 3 + Vuetify 3. Configuração do tema em `src/plugins/vuetify.ts`:
+
+```typescript
+theme: {
+  defaultTheme: "bethaTema",
+  themes: {
+    bethaTema: {
+      dark: false,
+      colors: {
+        primary:    "#007bff",
+        secondary:  "#6c757d",
+        background: "#EBEDF0",
+        surface:    "#ffffff",
+        error:      "#dc3545",
+        warning:    "#ffc107",
+        success:    "#28a745",
+        info:       "#17a2b8",
+      }
+    }
+  }
+}
+```
+
+- **Navbar** (`App.vue`): `<v-app-bar flat color="#343a40" theme="dark">`
+- **Botões:** sempre `color="primary"` para usar o token do tema
+
+---
+
+## 3. Branding Dinâmico — eBetha() nos Footers
+
+Todos os footers do ecossistema usam a função `eBetha()` para determinar a identidade da empresa exibida:
+
+```typescript
+import { eBetha } from "p-ambiente";
+
+// eBetha() == true  → Betha Sistemas Ltda, CNPJ 00.456.865/0001-67, Criciúma-SC
+// eBetha() == false → Azteca Software LTDA, CNPJ 29.979.144/0001-13, Içara-SC
+```
+
+**Arquivos de footer por frontend:**
+
+| Frontend | Arquivo |
+|----------|---------|
+| QUIPO-FRONT | `src/components/Footer.tsx` e `src/pages/Portal/PortalFooter.tsx` |
+| QUIPO-PORTAL3 | `src/components/Footer/Footer.tsx` |
+| AUTENTICACAO-FRONT | sem footer próprio |
+
+- O footer exibe sempre a versão da API e do frontend
+- O logotipo é condicional: logotipo diferente por marca
+
 ---
 
 ## Decisão: Como identificar qual estilo usar
 
 1. **Pergunte o contexto:** se o operador não especificar, pergunte se o módulo é para iniciativa privada (Floreta/Vuetify) ou governo (Betha)
 2. **Nunca misture:** um módulo usa UM estilo — nunca combine Vuetify com Betha Design
-3. **Header identifica:** header azul-escuro com logo "B" = Betha; barra lateral com menu Vuetify = Floreta
+3. **Header identifica:** header `#343a40` com logo = Betha; barra lateral com menu Vuetify customizado = Floreta
 
 ## Referências
 
 - Betha Design System: https://design.plataforma.betha.cloud/doc/index.html
 - Framework Design CDN: https://cdn.betha.cloud/base/g4/design/4.0.0/
+- Rule: `css-global-betha` (variáveis --bth-*)
+- Rule: `theme-provider-mui-betha` (arquitetura ThemeProvider)
+- Rule: `modal-dialog-padrao-betha` (estrutura de modais)
+- Memórias: https://memoria-ia.idz.one (códigos: 59, 62, 65)