/* ============================================================
   ADN EXPERT — Design v4 (v2 refinada)
   Grafite frio + índigo apenas como detalhe · Space Grotesk + Outfit
   Botões sempre escuros; cor forte fora dos botões
   ============================================================ */

:root {
  --tinta: #171A21;
  --tinta-suave: #4B5163;
  --texto-suave: #7B8194;
  --papel: #F5F6F8;
  --cartao: #FFFFFF;
  --linha: #E5E7EE;
  --acento: #5B67E8;
  --acento-suave: #EEF0FE;
  --acento-grad: linear-gradient(120deg, #6A76F0, #8A78F5);
  --verde: #1F9D6B;
  --verde-pale: #E6F6EF;
  --ambar: #C07E1D;
  --ambar-pale: #FBF2E2;
  --vermelho: #DC4C41;
  --vermelho-pale: #FCEBEA;
}

html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body {
  font-family: 'Outfit', -apple-system, sans-serif !important;
  background: var(--papel) !important;
  color: var(--tinta) !important;
}

h1 {
  font-family: 'Space Grotesk', 'Outfit', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  color: var(--tinta) !important;
}
h2, h3 {
  font-family: 'Outfit', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em;
  color: var(--tinta) !important;
}

.card {
  background: var(--cartao);
  border: 1px solid var(--linha) !important;
  border-radius: 16px !important;
  box-shadow: 0 1px 3px rgba(23, 26, 33, 0.05) !important;
  padding: 1.5rem;
}

/* ---------- Botões: sempre grafite; hover apenas escurece ---------- */
button[class*="bg-purple-6"], button[class*="bg-blue-6"], button[class*="bg-red-6"],
button[class*="bg-green-6"], button[class*="bg-pink-6"], button[class*="bg-cyan-6"],
button[class*="bg-yellow-5"], button[class*="bg-yellow-6"], button[class*="bg-indigo-6"],
button[class*="bg-teal-6"], button[class*="bg-amber-6"], button[class*="from-yellow-5"],
a[class*="bg-purple-6"], a[class*="bg-blue-6"], a[class*="bg-green-6"] {
  background: var(--tinta) !important;
  background-image: none !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 10px !important;
  font-weight: 500 !important;
  transition: background 0.16s ease, transform 0.1s ease !important;
}
button[class*="bg-purple-6"]:hover, button[class*="bg-blue-6"]:hover, button[class*="bg-red-6"]:hover,
button[class*="bg-green-6"]:hover, button[class*="bg-pink-6"]:hover, button[class*="bg-cyan-6"]:hover,
button[class*="bg-yellow-5"]:hover, button[class*="bg-yellow-6"]:hover,
a[class*="bg-purple-6"]:hover, a[class*="bg-blue-6"]:hover, a[class*="bg-green-6"]:hover {
  background: #2E3340 !important;
  color: #FFFFFF !important;
}
button:active { transform: scale(0.98); }

button[class*="border-gray-3"], button[class*="border-purple-3"], button[class*="border-amber-3"] {
  border: 1px solid var(--linha) !important;
  color: var(--tinta-suave) !important;
  background: var(--cartao) !important;
  border-radius: 10px !important;
}
button[class*="border-gray-3"]:hover { border-color: #C9CDDB !important; background: #FAFBFC !important; }

/* ---------- Índigo como detalhe: textos de destaque nos cards ---------- */
.card [class*="text-purple-6"], .card [class*="text-blue-6"],
.card [class*="text-pink-6"], .card [class*="text-cyan-6"], .card [class*="text-indigo-6"] { color: var(--acento) !important; }
.card [class*="text-green-6"] { color: var(--verde) !important; }
.card [class*="text-red-6"], .card [class*="text-red-5"] { color: var(--vermelho) !important; }
.card [class*="text-amber-6"], .card [class*="text-yellow-6"] { color: var(--ambar) !important; }

/* ---------- Barras de progresso: índigo suave (o lugar da cor) ---------- */
.card [class*="bg-gradient"][class*="rounded-full"],
[class*="rounded-full"][class*="from-blue-5"],
[class*="rounded-full"][class*="from-purple-5"] {
  background: var(--acento-grad) !important;
}
.card [class*="bg-gray-2"][class*="rounded-full"] { background: var(--linha) !important; }

/* ---------- Selos de status ---------- */
span[class*="bg-green-100"] { background: var(--verde-pale) !important; color: var(--verde) !important; }
span[class*="bg-yellow-100"], span[class*="bg-amber-100"] { background: var(--ambar-pale) !important; color: var(--ambar) !important; }
span[class*="bg-red-100"] { background: var(--vermelho-pale) !important; color: var(--vermelho) !important; }
span[class*="bg-blue-100"], span[class*="bg-purple-100"] { background: var(--acento-suave) !important; color: var(--acento) !important; }
span[class*="rounded-full"][class*="px-2"] { border-radius: 999px !important; font-weight: 500 !important; }

/* ---------- Lavagens internas ---------- */
.card div[class*="bg-purple-50"], .card div[class*="bg-blue-50"],
.card div[class*="bg-indigo-50"], .card div[class*="bg-cyan-50"] { background: var(--acento-suave) !important; }
.card div[class*="bg-amber-50"], .card div[class*="bg-yellow-50"] { background: var(--ambar-pale) !important; }
.card div[class*="bg-green-50"] { background: var(--verde-pale) !important; }
.card div[class*="bg-red-50"], .card div[class*="bg-pink-50"] { background: var(--vermelho-pale) !important; }
.card [class*="border-purple-4"], .card [class*="border-blue-4"],
.card [class*="border-amber-4"], .card [class*="border-purple-2"] { border-color: var(--acento) !important; }

/* ---------- Formulários ---------- */
input, select, textarea {
  font-family: 'Outfit', sans-serif !important;
  border: 1px solid var(--linha) !important;
  border-radius: 10px !important;
  background: var(--cartao) !important;
  color: var(--tinta) !important;
}
input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: var(--acento) !important;
  box-shadow: 0 0 0 3px rgba(91, 103, 232, 0.13) !important;
}
label { color: var(--tinta-suave) !important; font-weight: 500 !important; }
::placeholder { color: #A9AEBE !important; }

[class*="text-gray-5"] { color: var(--texto-suave) !important; }
[class*="text-gray-6"], [class*="text-gray-7"] { color: var(--tinta-suave) !important; }

/* ---------- Chat da Maísa ---------- */
#painel-assistente > div:first-child { background: var(--tinta) !important; border-bottom: 2px solid var(--acento) !important; }
#painel-assistente { border-radius: 18px !important; overflow: hidden; border: 1px solid var(--linha) !important; }
#botao-assistente { border-color: #FFFFFF !important; box-shadow: 0 6px 22px rgba(23, 26, 33, 0.25) !important; }
#assistente-mensagens [class*="bg-purple-6"] { background: var(--tinta) !important; }
#assistente-mensagens [class*="bg-purple-50"] { background: var(--acento-suave) !important; color: var(--tinta) !important; }
#assistente-mensagens [class*="text-purple-9"] { color: var(--tinta) !important; }

/* ---------- Modais ---------- */
.fixed[class*="bg-black"] > div[class*="bg-white"] { border-radius: 18px !important; border: 1px solid var(--linha); }
.fixed[class*="bg-opacity-50"] { background: rgba(23, 26, 33, 0.42) !important; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #C9CDD9; border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

:focus-visible { outline: 2px solid var(--acento) !important; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ============ CORREÇÕES DE LEGIBILIDADE E CHAT AMIGÁVEL ============ */

/* Elementos .adn-gold (agora escuros): conteúdo sempre branco */
.adn-gold, .adn-gold * { color: #FFFFFF !important; }

/* Menu lateral: item ativo legível (classes douradas antigas aplicadas pelo app.js) */
#sidebar a[class*="from-yellow"], #sidebar a[class*="adn-gold"],
#sidebar a[class*="bg-yellow"], #sidebar .adn-gold {
  background: #2A2E3A !important;
  background-image: none !important;
  border-radius: 12px !important;
}
#sidebar a[class*="from-yellow"] *, #sidebar a[class*="adn-gold"] *,
#sidebar a[class*="bg-yellow"] *, #sidebar a[class*="text-gray-9"],
#sidebar a[class*="text-gray-9"] * { color: #FFFFFF !important; }
#sidebar a { border-radius: 12px !important; }

/* ---------- Chat da Maísa: acolhedor e claro (visível ao cliente) ---------- */
#painel-assistente > div:first-child {
  background: #FFFFFF !important;
  border-bottom: 1px solid var(--linha) !important;
}
#painel-assistente > div:first-child p { color: var(--tinta) !important; }
#painel-assistente > div:first-child p:last-child { color: var(--verde) !important; }
#painel-assistente > div:first-child button { color: var(--texto-suave) !important; }
#painel-assistente > div:first-child img { border-color: var(--linha) !important; }
#painel-assistente {
  border-radius: 22px !important;
  border: 1px solid var(--linha) !important;
  box-shadow: 0 16px 48px rgba(23, 26, 33, 0.16) !important;
  overflow: hidden;
}
#botao-assistente {
  border: 3px solid #FFFFFF !important;
  box-shadow: 0 6px 22px rgba(23, 26, 33, 0.22) !important;
}
/* Balões: usuário grafite suave, Maísa cinza-claro */
#assistente-mensagens [class*="bg-purple-6"] { background: #3A4051 !important; border-radius: 16px 16px 4px 16px !important; }
#assistente-mensagens [class*="bg-gray-100"] { border-radius: 16px 16px 16px 4px !important; }
#assistente-mensagens [class*="bg-purple-50"] { background: var(--acento-suave) !important; color: var(--tinta) !important; border-radius: 16px !important; }
/* Botão enviar do chat: acento amigável */
#painel-assistente .border-t button { background: var(--acento) !important; border-radius: 12px !important; }
#painel-assistente .border-t button:hover { background: #4A55D8 !important; }

/* ============ MENU LATERAL: hover sempre legível ============ */
#sidebar a:hover, #sidebar a:hover * ,
#sidebar a[class*="hover:bg"]:hover, #sidebar a[class*="hover:bg"]:hover * {
  color: #FFFFFF !important;
}
#sidebar a[class*="hover:bg-yellow"]:hover, #sidebar a[class*="hover:from-yellow"]:hover,
#sidebar a[class*="hover:bg-gray"]:hover {
  background: #2A2E3A !important;
  background-image: none !important;
}
/* Qualquer botão/pílula escura garante conteúdo claro */
[class*="bg-gray-9"], [class*="bg-gray-9"] *,
[class*="bg-gray-8"][class*="text-gray"], [class*="bg-black"] i, [class*="bg-black"] span {
  color: #FFFFFF !important;
}
