/* Sobrescreve o bundle React: fundo verde musgo + acentos dourados */
html,
body {
  background-color: #2d3d2d !important;
}

#root {
  min-height: 100vh;
  background-color: #2d3d2d;
  /* Herança: parágrafos sem classe no fundo verde */
  color: #ffffff !important;
  /* style.css usa var(--paragraph-color) em h2–h4; no :root ainda é #3d3d32 */
  --paragraph-color: #ffffff;
}

/* Cartões claros dentro do app: voltar texto escuro */
#root .bg-white,
#root .bg-stone-50,
#root .bg-stone-100,
#root .bg-neutral-50,
#root .bg-neutral-100 {
  --paragraph-color: #3d3d32;
}

/* Seções estáticas claras (style.css) ainda dentro do React */
#root #contact,
#root #footer,
#root #features {
  --paragraph-color: #3d3d32;
}

/* Cores arbitrárias iguais às que você viu no inspetor */
#root .text-\[\#3b3d31\],
#root .text-\[\#3d3d32\] {
  color: #ffffff !important;
}

/* Tailwind / builds podem gerar classes diferentes; pega qualquer classe com esse hex no nome */
#root [class*="3b3d31"],
#root [class*="3B3D31"],
#root [class*="3d3d32"],
#root [class*="3D3D32"],
#root [style*="#3b3d31"],
#root [style*="#3B3D31"],
#root [style*="#3d3d32"],
#root [style*="#3D3D32"],
#root [style*="rgb(61, 61, 50)"],
#root [style*="rgb(61,61,50)"] {
  color: #ffffff !important;
}

/* Fundo claro: manter #3d3d32 legível (sobrescreve o bloco acima) */
#root .bg-white [class*="3b3d31"],
#root .bg-white [class*="3B3D31"],
#root .bg-white [class*="3d3d32"],
#root .bg-white [class*="3D3D32"],
#root .bg-white [style*="#3d3d32"],
#root .bg-white [style*="#3D3D32"],
#root .bg-stone-50 [class*="3d3d32"],
#root .bg-stone-100 [class*="3d3d32"],
#root .bg-neutral-50 [class*="3d3d32"],
#root .bg-neutral-100 [class*="3d3d32"] {
  color: #3d3d32 !important;
}

#root .text-\[\#6b5710\],
#root .text-\[\#6b5810\] {
  color: var(--accent-yellow, #fde047) !important;
}

/* Cinzas escuros do Tailwind → branco no tema escuro */
#root .text-stone-600,
#root .text-stone-700,
#root .text-stone-800,
#root .text-neutral-600,
#root .text-neutral-700,
#root .text-neutral-800,
#root .text-zinc-600,
#root .text-zinc-700,
#root .text-zinc-800,
#root .text-gray-600,
#root .text-gray-700,
#root .text-gray-800 {
  color: #ffffff !important;
}

/* Dourados/âmbar muito escuros (ex.: ícones ✓) → amarelo vivo */
#root .text-amber-700,
#root .text-amber-800,
#root .text-amber-900,
#root .text-yellow-800,
#root .text-yellow-900 {
  color: var(--accent-yellow, #fde047) !important;
}

/* Blocos com fundo claro: manter texto escuro legível */
#root .bg-white .text-gray-600,
#root .bg-white .text-gray-700,
#root .bg-white .text-gray-800,
#root .bg-white .text-neutral-600,
#root .bg-white .text-neutral-700,
#root .bg-white .text-neutral-800,
#root .bg-white .text-stone-600,
#root .bg-white .text-stone-700,
#root .bg-white .text-stone-800,
#root .bg-white .text-zinc-600,
#root .bg-white .text-zinc-700,
#root .bg-white .text-zinc-800,
#root .bg-stone-50 .text-gray-700,
#root .bg-stone-50 .text-gray-800,
#root .bg-stone-100 .text-gray-700,
#root .bg-stone-100 .text-gray-800,
#root .bg-neutral-50 .text-gray-700,
#root .bg-neutral-50 .text-gray-800,
#root .bg-neutral-100 .text-gray-700,
#root .bg-neutral-100 .text-gray-800 {
  color: #3d3d32 !important;
}

#root .bg-white .text-amber-700,
#root .bg-white .text-amber-800,
#root .bg-stone-50 .text-amber-800,
#root .bg-stone-100 .text-amber-800 {
  color: #92400e !important;
}

/* Trocar vermelhos típicos do Tailwind no CSS compilado (classes utilitárias) */
.text-red-50 {
  color: #f7f4ea !important;
}
.text-red-100 {
  color: #f0ead6 !important;
}
.text-red-200 {
  color: #e5dcb8 !important;
}
.text-red-300 {
  color: #d4c070 !important;
}
.text-red-400 {
  color: #dfc060 !important;
}
.text-red-500 {
  color: #d4af37 !important;
}
.text-red-600 {
  color: #c9a227 !important;
}
.text-red-700 {
  color: #9a7614 !important;
}
.text-red-800 {
  color: #7a6210 !important;
}
.text-red-900 {
  color: #5c4a0c !important;
}
.text-red-950 {
  color: #3d3510 !important;
}

.bg-red-50 {
  background-color: #f7f4ea !important;
}
.bg-red-100 {
  background-color: #f0ead6 !important;
}
.bg-red-200 {
  background-color: #e5dcb8 !important;
}
.bg-red-300 {
  background-color: #d4c070 !important;
}
.bg-red-400 {
  background-color: #dfc060 !important;
}
.bg-red-500 {
  background-color: #d4af37 !important;
}
.bg-red-600 {
  background-color: #c9a227 !important;
}
.bg-red-700 {
  background-color: #9a7614 !important;
}
.bg-red-800 {
  background-color: #7a6210 !important;
}
.bg-red-900 {
  background-color: #3d5240 !important;
}
.bg-red-950 {
  background-color: #2d3f2d !important;
}

.border-red-500,
.border-red-600 {
  border-color: #c9a227 !important;
}

.ring-red-500,
.ring-red-600 {
  --tw-ring-color: #c9a227 !important;
}

.from-red-600 {
  --tw-gradient-from: #c9a227 var(--tw-gradient-from-position) !important;
}
.to-red-950 {
  --tw-gradient-to: #2d3f2d var(--tw-gradient-to-position) !important;
}