# 🎨 Guia Visual de Customização de Cores - Checkout Pro 2025

## 📋 Documento de Referência das Cores do Sistema

Este documento mostra **exatamente onde cada cor configurada** na sessão de Customização é aplicada no sistema.

---

## 🎯 Cores Configuráveis

### 1. **Fundo da Sidebar** (`color_sidebar_bg`)

**Onde é aplicada:**
- Fundo do menu lateral esquerdo (sidebar)
- Área completa da sidebar, incluindo logo e menu

**Valor padrão:** `#1e3a8a` (Azul escuro)

**Visualização:**
```
┌─────────────────┐
│  [LOGO]         │ ← Fundo da Sidebar
│                 │
│  Dashboard      │
│  Produtos       │
│  Vendas         │
│  ...            │
└─────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--bg-sidebar`

---

### 2. **Texto da Sidebar** (`color_sidebar_text`)

**Onde é aplicada:**
- Texto de todos os itens do menu lateral
- Ícones dos itens do menu
- Texto do botão "Sair"

**Valor padrão:** `#e0e7ff` (Azul claro)

**Visualização:**
```
┌─────────────────┐
│  [LOGO]         │
│                 │
│  📊 Dashboard   │ ← Texto da Sidebar
│  📦 Produtos    │ ← Texto da Sidebar
│  🛒 Vendas      │ ← Texto da Sidebar
│  ...            │
└─────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--text-sidebar`

---

### 3. **Fundo do Header** (`color_header_bg`)

**Onde é aplicada:**
- Barra superior do dashboard (header/topbar)
- Área completa do cabeçalho, incluindo título e botões

**Valor padrão:** `#ffffff` (Branco)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│ ☰  Gestão de Produtos    [🌙] [👤] Admin   │ ← Fundo do Header
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--bg-header`

---

### 4. **Texto do Header** (`color_header_text`)

**Onde é aplicada:**
- Título da página no header
- Texto do botão de tema (lua/sol)
- Texto do badge do usuário
- Todos os textos dentro do header

**Valor padrão:** `#1f2937` (Cinza escuro)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│ ☰  Gestão de Produtos    [🌙] [👤] Admin   │ ← Texto do Header
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--text-main` (no header)

---

### 5. **Fundo do Body** (`color_body_bg`)

**Onde é aplicada:**
- Fundo de toda a página principal
- Área de conteúdo abaixo do header
- Fundo entre os cards

**Valor padrão:** `#f3f4f6` (Cinza muito claro)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│ Header                                       │
├─────────────────────────────────────────────┤
│                                              │
│  ┌──────────┐  ┌──────────┐                 │ ← Fundo do Body
│  │  Card 1  │  │  Card 2  │                 │
│  └──────────┘  └──────────┘                 │
│                                              │
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--bg-body`

---

### 6. **Fundo dos Cards** (`color_card_bg`)

**Onde é aplicada:**
- Fundo de todos os cards/panéis
- Fundo das tabelas
- Fundo dos formulários
- Fundo dos modais

**Valor padrão:** `#ffffff` (Branco)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│                                              │
│  ┌─────────────────────────────────────┐   │
│  │  Card/Painel                        │   │ ← Fundo dos Cards
│  │  ┌───────────────────────────────┐ │   │
│  │  │  Tabela                       │ │   │ ← Fundo dos Cards
│  │  └───────────────────────────────┘ │   │
│  └─────────────────────────────────────┘   │
│                                              │
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--bg-card`

---

### 7. **Texto Principal** (`color_text_main`)

**Onde é aplicada:**
- Texto principal de todas as páginas
- Títulos (h1, h2, h3)
- Texto das tabelas
- Texto dos formulários
- Texto dos cards

**Valor padrão:** `#1f2937` (Cinza escuro)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│  Título Principal                           │ ← Texto Principal
│                                              │
│  ┌─────────────────────────────────────┐   │
│  │  Nome    │  Email    │  Status     │   │ ← Texto Principal
│  │  João    │  joao@... │  Ativo      │   │ ← Texto Principal
│  └─────────────────────────────────────┘   │
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--text-main`

---

### 8. **Texto Muted** (`color_text_muted`)

**Onde é aplicada:**
- Texto secundário/desabilitado
- Texto de ajuda
- Texto de descrição
- Texto de placeholder
- Datas e informações secundárias

**Valor padrão:** `#6b7280` (Cinza médio)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│  Título Principal                           │
│  Descrição secundária                       │ ← Texto Muted
│                                              │
│  Criado em: 12/01/2025                     │ ← Texto Muted
│  Total: 150 registros                      │ ← Texto Muted
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--text-muted`

---

### 9. **Cor das Bordas** (`color_border`)

**Onde é aplicada:**
- Bordas dos cards
- Bordas das tabelas
- Bordas dos inputs
- Bordas dos modais
- Separadores de seções

**Valor padrão:** `#e5e7eb` (Cinza claro)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│  ┌─────────────────────────────────────┐   │
│  │  Card com borda                     │   │ ← Cor das Bordas
│  └─────────────────────────────────────┘   │
│                                              │
│  ┌─────────────────────────────────────┐   │
│  │  Input: [____________]               │   │ ← Cor das Bordas
│  └─────────────────────────────────────┘   │
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `dashboard/index.php` - Variável `--border-color`

---

## 🖼️ Logos Configuráveis

### 1. **Logo Sidebar (Admin)** (`logo_sidebar_admin`)

**Onde é exibida:**
- Área do logo no topo da sidebar do painel admin
- Visível apenas para administradores

**Localização:** `dashboard/index.php` - Linha ~348

**Tamanho recomendado:** 200x60px (ou proporcional)

---

### 2. **Logo Sidebar (Usuário)** (`logo_sidebar_user`)

**Onde é exibida:**
- Área do logo no topo da sidebar do painel do usuário
- Visível apenas para usuários comuns

**Localização:** `dashboard/usuario.php` - Linha ~295

**Tamanho recomendado:** 200x60px (ou proporcional)

---

### 3. **Favicon** (`logo_favicon`)

**Onde é exibida:**
- Ícone na aba do navegador
- Bookmark/favorito
- Histórico do navegador

**Localização:** `<head>` de todas as páginas via `load_settings.php`

**Tamanho recomendado:** 16x16px ou 32x32px (formato ICO ou PNG)

---

## 📍 Mapa Visual Completo

```
┌─────────────────────────────────────────────────────────────┐
│  HEADER (Fundo: color_header_bg | Texto: color_header_text) │
├──────────┬──────────────────────────────────────────────────┤
│          │                                                   │
│ SIDEBAR  │  BODY (Fundo: color_body_bg)                    │
│ (Fundo:  │                                                   │
│ color_   │  ┌─────────────────────────────────────────┐    │
│ sidebar_ │  │ CARD (Fundo: color_card_bg)             │    │
│ bg)      │  │ ┌───────────────────────────────────┐ │    │
│          │  │ │ Tabela                             │ │    │
│ [LOGO]   │  │ │ Texto: color_text_main             │ │    │
│          │  │ │ Bordas: color_border               │ │    │
│ Dashboard│  │ └───────────────────────────────────┘ │    │
│ (Texto:  │  │                                       │    │
│ color_   │  │ Texto secundário: color_text_muted    │    │
│ sidebar_ │  └─────────────────────────────────────────┘    │
│ text)    │                                                   │
│          │                                                   │
└──────────┴───────────────────────────────────────────────────┘
```

---

## 🔧 Como Aplicar as Cores

### Passo 1: Acessar Customização
1. Faça login como admin
2. Clique em "Customização" no menu lateral
3. Vá para a aba "Cores do Sistema"

### Passo 2: Configurar Cores
1. Clique no seletor de cor ao lado de cada opção
2. Escolha a cor desejada
3. O código hexadecimal será preenchido automaticamente
4. Clique em "Salvar Cores"

### Passo 3: Ver Mudanças
1. **IMPORTANTE:** Recarregue a página (F5 ou Ctrl+R)
2. As cores serão aplicadas imediatamente

---

## ⚠️ Observações Importantes

1. **Recarregar a Página:** Após salvar, sempre recarregue a página para ver as mudanças
2. **Modo Dark:** As cores customizadas funcionam em ambos os modos (claro e escuro)
3. **Compatibilidade:** Use cores que tenham bom contraste para legibilidade
4. **Formato:** Todas as cores devem estar no formato hexadecimal (#RRGGBB)

---

## 📝 Exemplo de Configuração

### Tema Verde
- **Fundo da Sidebar:** `#009846`
- **Texto da Sidebar:** `#ffffff`
- **Fundo do Header:** `#ffffff`
- **Texto do Header:** `#1f2937`
- **Fundo do Body:** `#f5f5f5`
- **Fundo dos Cards:** `#ffffff`
- **Texto Principal:** `#1f2937`
- **Texto Muted:** `#6b7280`
- **Cor das Bordas:** `#e5e7eb`

### Tema Azul Escuro
- **Fundo da Sidebar:** `#1e3a8a`
- **Texto da Sidebar:** `#e0e7ff`
- **Fundo do Header:** `#ffffff`
- **Texto do Header:** `#1f2937`
- **Fundo do Body:** `#f3f4f6`
- **Fundo dos Cards:** `#ffffff`
- **Texto Principal:** `#1f2937`
- **Texto Muted:** `#6b7280`
- **Cor das Bordas:** `#e5e7eb`

---

---

## 🛒 Cores do Marketplace

### 10. **Fundo do Marketplace** (`color_marketplace_bg`)

**Onde é aplicada:**
- Fundo completo da página do marketplace
- Área de fundo por trás de todos os elementos

**Valor padrão:** `#0f0c29` (Roxo escuro)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│  MARKETPLACE                                 │ ← Fundo do Marketplace
│  ┌──────────┐  ┌──────────┐                │
│  │ Produto  │  │ Produto  │                │
│  └──────────┘  └──────────┘                │
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `body { background: ... }`

---

### 11. **Título do Marketplace** (`color_marketplace_title`)

**Onde é aplicada:**
- Título principal "Marketing Place"
- Texto do cabeçalho do marketplace

**Valor padrão:** `#667eea` (Azul/roxo)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│  🏪 Marketing Place                        │ ← Título do Marketplace
│  Descubra produtos incríveis...             │
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.header h1 { color: ... }`

---

### 12. **Fundo do Topo (Filters)** (`color_marketplace_header_bg`)

**Onde é aplicada:**
- Fundo da área de filtros (categoria, ordenação)
- Área do topo com os seletores

**Valor padrão:** `#ffffff` (Branco com transparência)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│  [Filtrar por Categoria] [Ordenar por]     │ ← Fundo do Topo
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.filters { background: ... }`

---

### 13. **Texto do Topo (Filters)** (`color_marketplace_header_text`)

**Onde é aplicada:**
- Texto dos labels dos filtros
- Texto dos selects (categoria, ordenação)
- Texto "X produto(s) encontrado(s)"

**Valor padrão:** `#e0e0e0` (Cinza claro)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│  Filtrar por Categoria  [▼]                │ ← Texto do Topo
│  Ordenar por           [▼]                 │ ← Texto do Topo
│  📦 5 produto(s) encontrado(s)              │ ← Texto do Topo
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.filter-group label`, `.filter-group select`, `.results-count`

---

### 14. **Fundo dos Cards de Produtos** (`color_marketplace_card_bg`)

**Onde é aplicada:**
- Fundo de cada card de produto
- Área do card que contém imagem, nome, descrição, preço e botões

**Valor padrão:** `#ffffff` (Branco com transparência)

**Visualização:**
```
┌─────────────────────────────────────────────┐
│  ┌──────────────────────┐                  │
│  │ [Imagem]             │                  │
│  │ Nome do Produto       │ ← Fundo dos Cards
│  │ Descrição...          │                  │
│  │ R$ 99,90              │                  │
│  │ [Comprar] [Afiliar]   │                  │
│  └──────────────────────┘                  │
└─────────────────────────────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.product-card { background: ... }`

---

### 15. **Nome dos Produtos** (`color_marketplace_product_name`)

**Onde é aplicada:**
- Nome/título de cada produto no card
- Texto principal do produto

**Valor padrão:** `#ffffff` (Branco)

**Visualização:**
```
┌──────────────────────┐
│ [Imagem]             │
│ Nome do Produto      │ ← Nome dos Produtos
│ Descrição...         │
└──────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.product-name { color: ... }`

---

### 16. **Categoria dos Produtos** (`color_marketplace_category`)

**Onde é aplicada:**
- Tag/categoria acima do nome do produto
- Texto da categoria (ex: "Categoria: Eletrônicos")

**Valor padrão:** `#667eea` (Azul/roxo)

**Visualização:**
```
┌──────────────────────┐
│ [Imagem]             │
│ 📌 ELETRÔNICOS       │ ← Categoria dos Produtos
│ Nome do Produto      │
└──────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.product-category { color: ... }`

---

### 17. **Preço dos Produtos** (`color_marketplace_price`)

**Onde é aplicada:**
- Preço atual do produto (valor principal)
- Valor destacado em destaque

**Valor padrão:** `#4ade80` (Verde)

**Visualização:**
```
┌──────────────────────┐
│ Nome do Produto       │
│ Descrição...          │
│ De: R$ 199,90         │
│ R$ 99,90              │ ← Preço dos Produtos
└──────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.product-price-current { color: ... }`

---

### 18. **Botão Comprar** (`color_marketplace_button_buy`)

**Onde é aplicada:**
- Fundo do botão "Comprar" nos cards de produtos
- Cor de fundo do botão principal de ação

**Valor padrão:** `#667eea` (Azul/roxo)

**Visualização:**
```
┌──────────────────────┐
│ Nome do Produto       │
│ R$ 99,90              │
│ ┌──────────────────┐ │
│ │ 🛒 Comprar       │ │ ← Botão Comprar
│ └──────────────────┘ │
└──────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.product-button { background: ... }`

---

### 19. **Botão Afiliar** (`color_marketplace_button_affiliate`)

**Onde é aplicada:**
- Fundo do botão "Afiliar" nos cards de produtos
- Cor de fundo do botão secundário de ação

**Valor padrão:** `#10b981` (Verde)

**Visualização:**
```
┌──────────────────────┐
│ Nome do Produto       │
│ R$ 99,90              │
│ ┌──────────────────┐ │
│ │ 🤝 Afiliar        │ │ ← Botão Afiliar
│ └──────────────────┘ │
└──────────────────────┘
```

**Arquivo CSS:** `views/marketplace.php` - `.product-button-affiliate { background: ... }`

---

## 📍 Mapa Visual Completo do Marketplace

```
┌─────────────────────────────────────────────────────────────┐
│  MARKETPLACE (Fundo: color_marketplace_bg)                  │
│                                                              │
│  🏪 Marketing Place (Título: color_marketplace_title)       │
│  Descubra produtos...                                        │
│                                                              │
│  ┌──────────────────────────────────────────────────────┐   │
│  │ FILTROS (Fundo: color_marketplace_header_bg)         │   │
│  │ Texto: color_marketplace_header_text                 │   │
│  │ [Categoria ▼] [Ordenar ▼]                           │   │
│  └──────────────────────────────────────────────────────┘   │
│                                                              │
│  ┌──────────────┐  ┌──────────────┐                        │
│  │ CARD        │  │ CARD          │                        │
│  │ (Fundo:     │  │ (Fundo:       │                        │
│  │ color_      │  │ color_        │                        │
│  │ marketplace_│  │ marketplace_  │                        │
│  │ card_bg)    │  │ card_bg)      │                        │
│  │             │  │               │                        │
│  │ 📌 CATEG    │  │ 📌 CATEG      │                        │
│  │ (color_     │  │ (color_       │                        │
│  │ marketplace_│  │ marketplace_  │                        │
│  │ category)   │  │ category)     │                        │
│  │             │  │               │                        │
│  │ Nome Produto│  │ Nome Produto  │                        │
│  │ (color_     │  │ (color_       │                        │
│  │ marketplace_│  │ marketplace_  │                        │
│  │ product_    │  │ product_      │                        │
│  │ name)       │  │ name)         │                        │
│  │             │  │               │                        │
│  │ R$ 99,90    │  │ R$ 99,90      │                        │
│  │ (color_     │  │ (color_       │                        │
│  │ marketplace_│  │ marketplace_  │                        │
│  │ price)      │  │ price)        │                        │
│  │             │  │               │                        │
│  │ [Comprar]   │  │ [Comprar]     │                        │
│  │ (color_     │  │ (color_       │                        │
│  │ marketplace_│  │ marketplace_  │                        │
│  │ button_buy)  │  │ button_buy)   │                        │
│  │             │  │               │                        │
│  │ [Afiliar]   │  │ [Afiliar]     │                        │
│  │ (color_     │  │ (color_       │                        │
│  │ marketplace_│  │ marketplace_  │                        │
│  │ button_     │  │ button_       │                        │
│  │ affiliate)  │  │ affiliate)    │                        │
│  └──────────────┘  └──────────────┘                        │
└─────────────────────────────────────────────────────────────┘
```

---

## 🔧 Correções Aplicadas

### ✅ Problema do Ícone "Checkout" no Sidebar

**Problema:** O ícone do menu "Checkout" estava recebendo a cor de fundo dos cards.

**Solução:** Adicionado CSS específico para garantir que os ícones do menu não recebam fundo dos cards:

```css
.nav-link i {
    background: transparent !important;
}
```

**Arquivo:** `dashboard/index.php`

---

## 🎨 Cores Adicionais do Dashboard

### 20. **Botão Primário** (`color_button_primary`)

**Onde é aplicada:**
- Botões principais do sistema
- Botões de ação principal
- Botões de formulários

**Valor padrão:** `#009846` (Verde)

**Arquivo CSS:** `dashboard/includes/load_settings.php`

---

### 21. **Botão Primário (Hover)** (`color_button_primary_hover`)

**Onde é aplicada:**
- Estado hover dos botões principais
- Quando passa o mouse sobre botões primários

**Valor padrão:** `#007635` (Verde escuro)

---

### 22. **Botão Editar** (`color_button_edit`)

**Onde é aplicada:**
- Botões de editar em tabelas
- Links de edição

**Valor padrão:** `#2196F3` (Azul)

---

### 23. **Botão Visualizar** (`color_button_view`)

**Onde é aplicada:**
- Botões de visualizar
- Links de visualização

**Valor padrão:** `#17a2b8` (Azul claro)

---

### 24. **Botão Excluir** (`color_button_delete`)

**Onde é aplicada:**
- Botões de excluir
- Links de exclusão

**Valor padrão:** `#dc3545` (Vermelho)

---

### 25. **Botão Salvar** (`color_button_save`)

**Onde é aplicada:**
- Botões de salvar
- Botões de submit

**Valor padrão:** `#28a745` (Verde)

---

### 26. **Status Sucesso** (`color_status_success`)

**Onde é aplicada:**
- Indicadores de sucesso
- Status ativo

**Valor padrão:** `#28a745` (Verde)

---

### 27. **Status Aviso** (`color_status_warning`)

**Onde é aplicada:**
- Indicadores de aviso
- Alertas

**Valor padrão:** `#ffc107` (Amarelo)

---

### 28. **Status Erro** (`color_status_danger`)

**Onde é aplicada:**
- Indicadores de erro
- Status bloqueado

**Valor padrão:** `#dc3545` (Vermelho)

---

### 29. **Status Info** (`color_status_info`)

**Onde é aplicada:**
- Indicadores informativos
- Informações gerais

**Valor padrão:** `#17a2b8` (Azul claro)

---

### 30. **Fundo do Header da Tabela** (`color_table_header_bg`)

**Onde é aplicada:**
- Fundo do cabeçalho das tabelas
- Background dos `<th>`

**Valor padrão:** `#f8f9fa` (Cinza muito claro)

---

### 31. **Texto do Header da Tabela** (`color_table_header_text`)

**Onde é aplicada:**
- Texto do cabeçalho das tabelas
- Cor do texto dos `<th>`

**Valor padrão:** `#495057` (Cinza escuro)

---

### 32. **Hover da Linha da Tabela** (`color_table_row_hover`)

**Onde é aplicada:**
- Fundo ao passar o mouse sobre linhas da tabela
- Estado hover de `<tr>`

**Valor padrão:** `#f5f5f5` (Cinza claro)

---

### 33. **Cor dos Links** (`color_link`)

**Onde é aplicada:**
- Links do sistema (exceto menu e botões)
- Textos clicáveis

**Valor padrão:** `#007bff` (Azul)

---

### 34. **Cor dos Links (Hover)** (`color_link_hover`)

**Onde é aplicada:**
- Estado hover dos links
- Quando passa o mouse sobre links

**Valor padrão:** `#0056b3` (Azul escuro)

---

### 35. **Badge Sucesso (Ativo)** (`color_badge_success`)

**Onde é aplicada:**
- Badges de status "Ativo"
- Indicadores de sucesso

**Valor padrão:** `#28a745` (Verde)

---

### 36. **Badge Erro (Bloqueado)** (`color_badge_danger`)

**Onde é aplicada:**
- Badges de status "Bloqueado"
- Indicadores de erro

**Valor padrão:** `#dc3545` (Vermelho)

---

### 37. **Badge Info (Admin)** (`color_badge_info`)

**Onde é aplicada:**
- Badges de "Admin"
- Indicadores informativos

**Valor padrão:** `#17a2b8` (Azul claro)

---

### 38. **Badge Aviso (Usuário)** (`color_badge_warning`)

**Onde é aplicada:**
- Badges de "Usuário"
- Indicadores de aviso

**Valor padrão:** `#ffc107` (Amarelo)

---

### 39. **Borda do Input (Focus)** (`color_input_focus`)

**Onde é aplicada:**
- Borda dos inputs quando estão em foco
- Campos de formulário ativos

**Valor padrão:** `#009846` (Verde)

---

### 40. **Sombra do Input (Focus)** (`color_input_focus_shadow`)

**Onde é aplicada:**
- Sombra dos inputs quando estão em foco
- Efeito de destaque (rgba)

**Valor padrão:** `rgba(0, 152, 70, 0.25)`

---

### 41. **Fundo Mensagem Sucesso** (`color_message_success_bg`)

**Onde é aplicada:**
- Fundo das mensagens de sucesso
- Alertas de sucesso

**Valor padrão:** `#d4edda` (Verde claro)

---

### 42. **Texto Mensagem Sucesso** (`color_message_success_text`)

**Onde é aplicada:**
- Texto das mensagens de sucesso
- Cor do texto em alertas de sucesso

**Valor padrão:** `#155724` (Verde escuro)

---

### 43. **Fundo Mensagem Erro** (`color_message_error_bg`)

**Onde é aplicada:**
- Fundo das mensagens de erro
- Alertas de erro

**Valor padrão:** `#f8d7da` (Vermelho claro)

---

### 44. **Texto Mensagem Erro** (`color_message_error_text`)

**Onde é aplicada:**
- Texto das mensagens de erro
- Cor do texto em alertas de erro

**Valor padrão:** `#721c24` (Vermelho escuro)

---

### 45. **Fundo do Modal** (`color_modal_bg`)

**Onde é aplicada:**
- Fundo dos modais
- Janelas de diálogo

**Valor padrão:** `#ffffff` (Branco)

---

### 46. **Fundo do Header do Modal** (`color_modal_header_bg`)

**Onde é aplicada:**
- Fundo do cabeçalho dos modais
- Header das janelas de diálogo

**Valor padrão:** `#f8f9fa` (Cinza muito claro)

---

### 47. **Texto do Header do Modal** (`color_modal_header_text`)

**Onde é aplicada:**
- Texto do cabeçalho dos modais
- Título das janelas de diálogo

**Valor padrão:** `#333333` (Cinza escuro)

---

## 📊 Resumo Completo de Todas as Cores

### Dashboard (9 cores)
1. Fundo da Sidebar
2. Texto da Sidebar
3. Fundo do Header
4. Texto do Header
5. Fundo do Body
6. Fundo dos Cards
7. Texto Principal
8. Texto Muted
9. Cor das Bordas

### Marketplace (10 cores)
10. Fundo do Marketplace
11. Título do Marketplace
12. Fundo do Topo (Filters)
13. Texto do Topo (Filters)
14. Fundo dos Cards de Produtos
15. Nome dos Produtos
16. Categoria dos Produtos
17. Preço dos Produtos
18. Botão Comprar
19. Botão Afiliar

### Botões e Ações (6 cores)
20. Botão Primário
21. Botão Primário (Hover)
22. Botão Editar
23. Botão Visualizar
24. Botão Excluir
25. Botão Salvar

### Status (4 cores)
26. Status Sucesso
27. Status Aviso
28. Status Erro
29. Status Info

### Tabelas (3 cores)
30. Fundo do Header da Tabela
31. Texto do Header da Tabela
32. Hover da Linha da Tabela

### Links (2 cores)
33. Cor dos Links
34. Cor dos Links (Hover)

### Badges (4 cores)
35. Badge Sucesso (Ativo)
36. Badge Erro (Bloqueado)
37. Badge Info (Admin)
38. Badge Aviso (Usuário)

### Inputs (2 cores)
39. Borda do Input (Focus)
40. Sombra do Input (Focus)

### Mensagens (4 cores)
41. Fundo Mensagem Sucesso
42. Texto Mensagem Sucesso
43. Fundo Mensagem Erro
44. Texto Mensagem Erro

### Modais (3 cores)
45. Fundo do Modal
46. Fundo do Header do Modal
47. Texto do Header do Modal

**Total: 47 cores customizáveis**

---

**Última atualização:** 2025-01-XX
**Versão do Sistema:** Checkout Pro 2025 v2.0

