/*
 * ========================================
 * CUSTOM THEME - Calculadora de Marketplaces
 * ========================================
 * 
 * Este arquivo permite personalizar as cores e espaçamentos
 * do sistema sem alterar o código-fonte.
 *
 * COMO USAR:
 * 1. Descomente as variáveis que deseja alterar
 * 2. Modifique os valores HSL (Hue Saturation Lightness)
 * 3. Salve o arquivo e recarregue a página
 *
 * FORMATO HSL: hue(0-360) saturation(0-100%) lightness(0-100%)
 * Exemplo: 161 94% 30% = verde primário atual
 *
 * Gerador de cores HSL: https://hslpicker.com/
 * ========================================
 */

:root {
  /* === COR PRINCIPAL (Primary) === */
  /* Cor usada em botões, links, destaques e elementos interativos */
  /* --primary: 161 94% 30%; */           /* Verde atual */
  /* --primary-foreground: 0 0% 10%; */   /* Texto sobre botões primários */
  /* --ring: 161 94% 30%; */              /* Cor do foco/outline (geralmente igual ao primary) */

  /* === FUNDO E TEXTO PRINCIPAL === */
  /* --background: 150 20% 98%; */        /* Fundo geral da página */
  /* --foreground: 160 30% 8%; */         /* Cor do texto principal */

  /* === CARDS E PAINÉIS === */
  /* --card: 0 0% 100%; */                /* Fundo dos cards */
  /* --card-foreground: 160 30% 8%; */    /* Texto dentro dos cards */

  /* === CORES SECUNDÁRIAS === */
  /* --secondary: 152 25% 93%; */
  /* --secondary-foreground: 160 30% 12%; */
  /* --accent: 152 45% 90%; */
  /* --accent-foreground: 161 80% 18%; */

  /* === CORES AUXILIARES === */
  /* --muted: 150 16% 94%; */             /* Fundo de áreas desabilitadas/neutras */
  /* --muted-foreground: 160 8% 40%; */   /* Texto secundário/dicas */
  /* --destructive: 0 72% 51%; */         /* Vermelho para erros e alertas */
  /* --success: 142 71% 36%; */           /* Verde para sucesso */
  /* --warning: 38 92% 45%; */            /* Amarelo para avisos */

  /* === BORDAS E INPUTS === */
  /* --border: 150 14% 88%; */
  /* --input: 150 14% 85%; */

  /* === ARREDONDAMENTO === */
  /* --radius: 0.5rem; */                 /* Arredondamento padrão (8px) */

  /* === GRÁFICOS DO DASHBOARD === */
  /* --chart-1: 161 94% 30%; */
  /* --chart-2: 210 100% 69%; */
  /* --chart-3: 25 100% 64%; */
  /* --chart-4: 0 100% 69%; */
  /* --chart-5: 43 100% 50%; */
}

/* === TEMA ESCURO === */
/* Descomente para personalizar o modo escuro separadamente */
/*.dark {
  --primary: 158 64% 45%;
  --primary-foreground: 165 30% 6%;
  --background: 165 25% 6%;
  --foreground: 150 15% 95%;
  --card: 165 22% 9%;
  --card-foreground: 150 15% 95%;
}*/

/* ========================================
 * EXEMPLOS DE TEMAS PRÉ-DEFINIDOS
 * Descomente um bloco inteiro para aplicar
 * ========================================
 */

/* --- TEMA AZUL --- */
/*
:root {
  --primary: 220 90% 45%;
  --primary-foreground: 0 0% 100%;
  --ring: 220 90% 45%;
  --accent: 220 45% 90%;
  --accent-foreground: 220 80% 18%;
}
*/

/* --- TEMA ROXO --- */
/*
:root {
  --primary: 270 80% 50%;
  --primary-foreground: 0 0% 100%;
  --ring: 270 80% 50%;
  --accent: 270 40% 92%;
  --accent-foreground: 270 70% 20%;
}
*/

/* --- TEMA LARANJA --- */
/*
:root {
  --primary: 25 95% 50%;
  --primary-foreground: 0 0% 100%;
  --ring: 25 95% 50%;
  --accent: 25 60% 92%;
  --accent-foreground: 25 80% 18%;
}
*/
