/* Tema da 2B por cima do Twenty: mesma paleta do app.2bgrowth.com.br
   (tailwind.config.js do 2b-app: navy + accent #2f6df0, fonte Inter, que o Twenty ja usa).
   Fora de @layer de proposito: estilo sem camada ganha das variaveis do Twenty,
   que moram em @layer twenty-ui. Assim nenhum arquivo gerado do upstream e editado.
   O Twenty usa a escala "blue" como accent; as duas recebem a escala da 2B. */

.light {
  --b2-1: #fafbfe;
  --b2-2: #f3f6fe;
  --b2-3: #e7eefe; /* accent.soft do app */
  --b2-4: #d6e2fd;
  --b2-5: #c2d4fc;
  --b2-6: #a9c1f9;
  --b2-7: #86a7f5;
  --b2-8: #5b88f2;
  --b2-9: #2f6df0; /* accent do app */
  --b2-10: #2159d6;
  --b2-11: #1b3566; /* navy-700 */
  --b2-12: #0a1a35; /* navy-900 */
  --t-illustration-icon-fill-blue: var(--b2-5);
  --t-background-transparent-blue: color-mix(in srgb, #2f6df0 7%, transparent);
  --t-color-transparent-blue3: color-mix(in srgb, #2f6df0 7%, transparent);
  --t-color-transparent-blue5: color-mix(in srgb, #2f6df0 18%, transparent);
  --t-color-transparent-blue9: color-mix(in srgb, #2f6df0 76%, transparent);
}

.dark {
  --b2-1: #060f20; /* navy-950 */
  --b2-2: #0a1a35;
  --b2-3: #0f2245;
  --b2-4: #122549; /* navy-800 */
  --b2-5: #1b3566;
  --b2-6: #243d6e;
  --b2-7: #2c4f93;
  --b2-8: #3a62b8;
  --b2-9: #2f6df0;
  --b2-10: #4a82f5;
  --b2-11: #9db9f8;
  --b2-12: #dfe8fd;
  --t-illustration-icon-fill-blue: var(--b2-12);
  --t-background-transparent-blue: color-mix(in srgb, #2f6df0 34%, transparent);
  --t-color-transparent-blue3: color-mix(in srgb, #2f6df0 24%, transparent);
  --t-color-transparent-blue5: color-mix(in srgb, #2f6df0 42%, transparent);
  --t-color-transparent-blue9: color-mix(in srgb, #2f6df0 86%, transparent);
}

.light,
.dark {
  --t-accent-primary: var(--b2-5);
  --t-accent-secondary: var(--b2-5);
  --t-accent-tertiary: var(--b2-3);
  --t-accent-quaternary: var(--b2-2);
  --t-accent-accent3570: var(--b2-8);
  --t-accent-accent4060: var(--b2-8);
  --t-accent-accent1: var(--b2-1);
  --t-accent-accent2: var(--b2-2);
  --t-accent-accent3: var(--b2-3);
  --t-accent-accent4: var(--b2-4);
  --t-accent-accent5: var(--b2-5);
  --t-accent-accent6: var(--b2-6);
  --t-accent-accent7: var(--b2-7);
  --t-accent-accent8: var(--b2-8);
  --t-accent-accent9: var(--b2-9);
  --t-accent-accent10: var(--b2-10);
  --t-accent-accent11: var(--b2-11);
  --t-accent-accent12: var(--b2-12);

  --t-color-blue: var(--b2-9);
  --t-border-color-blue: var(--b2-7);
  --t-illustration-icon-color-blue: var(--b2-8);
  --t-tag-text-blue: var(--b2-11);
  --t-tag-background-blue: var(--b2-3);
  --t-color-blue1: var(--b2-1);
  --t-color-blue2: var(--b2-2);
  --t-color-blue3: var(--b2-3);
  --t-color-blue4: var(--b2-4);
  --t-color-blue5: var(--b2-5);
  --t-color-blue6: var(--b2-6);
  --t-color-blue7: var(--b2-7);
  --t-color-blue8: var(--b2-8);
  --t-color-blue9: var(--b2-9);
  --t-color-blue10: var(--b2-10);
  --t-color-blue11: var(--b2-11);
  --t-color-blue12: var(--b2-12);
}