/* FLUQ: tema do app WhatsApp do macOS (modo escuro), cores medidas do print de referência.
   Logo original mantida. O modo claro não foi alterado (sem referência). */

/* Fonte do sistema da Apple (SF Pro no Mac; cai em fonte de sistema nos demais) */
body, body *:not(code):not(pre):not(kbd):not(samp) {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.dark {
  --fluq-papel: #0a0a0a;
  --fluq-topo: #141414;
  --fluq-bolha-in: #242626;
  --fluq-bolha-out: #264c39;
  --fluq-verde: #5cbd6d;
  --fluq-verde-botao: #1eac62;

  --background-color: 37 38 39;
  --surface-1: 30 30 30;
  --surface-2: 36 36 36;
  --surface-active: 50 51 52;
  --solid-1: 30 30 30;
  --solid-2: 41 41 41;
  --solid-3: 60 60 60;
  --solid-active: 50 51 52;
  --card-color: 36 36 36;
  --button-color: 60 60 60;
  --border-container: 45 45 45;
  --border-weak: 45 45 45;
  --border-strong: 60 60 60;

  --slate-1: 30 30 30;
  --slate-2: 36 36 36;
  --slate-3: 41 41 41;
  --slate-4: 50 51 52;
  --slate-5: 53 53 53;
  --slate-6: 60 60 60;
  --slate-7: 75 75 75;
  --slate-8: 100 100 100;
  --slate-9: 114 115 117;
  --slate-10: 149 147 147;
  --slate-11: 190 190 190;
  --slate-12: 250 250 250;

  --blue-1: 20 36 28;
  --blue-2: 23 44 34;
  --blue-3: 26 52 42;
  --blue-4: 30 61 46;
  --blue-5: 38 76 57;
  --blue-6: 52 100 74;
  --blue-7: 60 130 90;
  --blue-8: 30 172 98;
  --blue-9: 30 172 98;
  --blue-10: 52 184 108;
  --blue-11: 92 189 109;
  --blue-12: 224 252 215;
  --solid-blue: 38 76 57;
  --solid-blue-2: 23 44 34;
}

/* Cor da marca (fixa em azul no sistema) -> verde do WhatsApp */
.dark .bg-n-brand, .dark .checked\:bg-n-brand:checked, .dark .bg-woot-500, .dark .bg-woot-600 { background-color: var(--fluq-verde-botao) !important; }
.dark .hover\:bg-n-brand:hover, .dark .hover\:enabled\:bg-n-brand:enabled:hover { background-color: #189454 !important; }
.dark .text-n-brand, .dark .hover\:text-n-brand:hover, .dark .text-woot-500, .dark .text-woot-600, .dark a:not([class*="bg-"]):not(.fluq-open-conv) { color: var(--fluq-verde) !important; }
.dark .border-n-brand, .dark .checked\:border-n-brand:checked, .dark .border-woot-500, .dark .focus\:border-woot-500:focus { border-color: var(--fluq-verde-botao) !important; }
.dark .outline-n-brand, .dark .focus\:outline-n-brand:focus, .dark .focus-within\:outline-n-brand:focus-within { outline-color: var(--fluq-verde-botao) !important; }
.dark .ring-n-brand { --tw-ring-color: var(--fluq-verde-botao) !important; }

/* Bolhas */
.dark .left-bubble { background-color: var(--fluq-bolha-in) !important; color: #fafafa; }
.dark .right-bubble { background-color: var(--fluq-bolha-out) !important; color: #fafafa; }
.dark .left-bubble, .dark .right-bubble { border-radius: 12px !important; box-shadow: none; }

/* Conversa: fundo, topo e caixa de mensagem */
.dark .conversation-panel { background-color: var(--fluq-papel) !important; }
.dark .conversation-details-wrap > div:first-child { background-color: var(--fluq-topo); }
.dark .conversation-details-wrap .reply-box { background-color: #292929; border-radius: 20px; }

/* Lista de conversas e busca */
.dark .conversations-list-wrap { background-color: #1e1e1e; }
.dark .conversations-list-wrap > div:first-child { background-color: #1e1e1e; }
