/*
 * Identidade visual Agitare sobre o Chatwoot v4.18.
 *
 * O Chatwoot define a paleta em app/javascript/dashboard/assets/scss/
 * _next-colors.scss, dentro de @layer base, com valores "R G B". CSS sem
 * layer sempre vence CSS em layer, então basta redefinir as variáveis aqui.
 *
 * - A escala "blue" é a cor primária do painel (botões, links, seleção):
 *   vira a escala pink da Agitare (#F02D62 no passo 9, #D61F55 no 11 para
 *   texto, contraste 5:1 com branco).
 * - Modo escuro: fundos azul-noite do site (#0C0F1E / #111428 / #1A1F38).
 *
 * Toda variável redefinida em :root precisa ser redefinida também em
 * .dark: como este arquivo não usa layer, um :root daqui venceria o .dark
 * original do Chatwoot.
 *
 * Ao atualizar o Chatwoot, conferir se os nomes das variáveis mudaram.
 */

:root {
  --blue-1: 255 252 253;
  --blue-2: 255 246 248;
  --blue-3: 254 234 239;
  --blue-4: 253 220 229;
  --blue-5: 250 204 217;
  --blue-6: 245 184 201;
  --blue-7: 238 158 181;
  --blue-8: 232 124 156;
  --blue-9: 240 45 98;
  --blue-10: 226 33 87;
  --blue-11: 214 31 85;
  --blue-12: 98 18 44;

  --text-blue: 60 10 28;
  --border-blue: 240, 45, 98, 0.5;
  --border-blue-strong: 118 20 50;
  --solid-blue: 253 220 229;
  --solid-blue-2: 255 252 253;
}

.dark {
  --blue-1: 25 14 18;
  --blue-2: 32 17 22;
  --blue-3: 60 18 31;
  --blue-4: 82 18 40;
  --blue-5: 99 26 51;
  --blue-6: 118 38 65;
  --blue-7: 145 50 82;
  --blue-8: 186 60 100;
  --blue-9: 240 45 98;
  --blue-10: 250 70 118;
  --blue-11: 255 140 168;
  --blue-12: 255 210 222;

  --text-blue: 255 222 231;
  --border-blue: 240, 45, 98, 0.5;
  --border-blue-strong: 250 204 217;
  --solid-blue: 82 18 40;
  --solid-blue-2: 26 31 56;

  /* fundos azul-noite da agitare.com.br */
  --background-color: 12 15 30;
  --surface-1: 12 15 30;
  --surface-2: 17 20 40;
  --surface-active: 44 50 82;
  --solid-1: 17 20 40;
  --solid-2: 26 31 56;
  --solid-3: 36 42 72;
  --solid-active: 44 50 82;
  --card-color: 17 20 40;
  --button-color: 26 31 56;
  --label-background: 26 31 56;
  --border-strong: 40 46 76;
  --border-weak: 28 33 60;
}
