/* ==========================================================================
   RTFlow — Design tokens (single source of truth)

   Every raw value lives HERE, once. tailwind.config.ts references these
   custom properties (never re-declares hex), so Tailwind utilities and any
   inline style read from the same place. Theme switching = swap the vars
   under [data-rt-theme="dark"]; no component is rewritten.

   Brand: Azul RTFlow #1F3E77 · Azul Profundo #152548 · Azul Petróleo #1F7795
   Concept: clareza temporal · confiança clínica · cor com função.
   ========================================================================== */

:root {
  /* ---------- Brand anchors ---------- */
  --rt-brand-primary: #1f3e77;
  --rt-brand-deep: #152548;
  --rt-brand-teal: #1f7795;

  /* ---------- Navy scale (primary) ---------- */
  --rt-navy-50: #eef2f9;
  --rt-navy-100: #d8e0ef;
  --rt-navy-200: #b0c0de;
  --rt-navy-300: #82a0c9;
  --rt-navy-400: #5a7fb1;
  --rt-navy-500: #3d6097;
  --rt-navy-600: #1f3e77; /* primary */
  --rt-navy-700: #1a3563;
  --rt-navy-800: #152548;
  --rt-navy-900: #0e1a33;
  --rt-navy-950: #070d1c;

  /* ---------- Teal scale (accent) ---------- */
  --rt-teal-50: #ecf5f8;
  --rt-teal-100: #cfe6ed;
  --rt-teal-200: #9ecddc;
  --rt-teal-300: #6bb1c7;
  --rt-teal-400: #3f94ae;
  --rt-teal-500: #1f7795;
  --rt-teal-600: #1a6480;
  --rt-teal-700: #155267;
  --rt-teal-800: #11414f;
  --rt-teal-900: #0b2d38;

  /* ---------- Neutrals (cool, navy-paired) ---------- */
  --rt-neutral-0: #ffffff;
  --rt-neutral-50: #f8fafc;
  --rt-neutral-100: #f1f4f8;
  --rt-neutral-150: #e8ecf2;
  --rt-neutral-200: #dce2ea;
  --rt-neutral-300: #c2cad5;
  --rt-neutral-400: #9aa3b1;
  --rt-neutral-500: #6f7787;
  --rt-neutral-600: #545b6a;
  --rt-neutral-700: #3d4350;
  --rt-neutral-800: #262b36;
  --rt-neutral-900: #161a22;
  --rt-neutral-950: #0b0d13;

  /* ---------- Status (clinical-calibrated) ---------- */
  --rt-success-50: #e8f5ec;
  --rt-success-100: #c8e6cf;
  --rt-success-500: #2e7d32;
  --rt-success-600: #246628;
  --rt-success-700: #1b4f1f;

  --rt-warning-50: #fff6e0;
  --rt-warning-100: #ffe6a8;
  --rt-warning-500: #e08e00;
  --rt-warning-600: #b86f00;
  --rt-warning-700: #8c5400;

  --rt-danger-50: #fbeaea;
  --rt-danger-100: #f4c8c8;
  --rt-danger-500: #d32f2f;
  --rt-danger-600: #ae2424;
  --rt-danger-700: #871b1b;

  --rt-info-50: #e6f1fa;
  --rt-info-100: #bbd8f1;
  --rt-info-500: #1f77c2;
  --rt-info-600: #195e9a;

  /* ---------- Professional-role colors (color = function) ---------- */
  --rt-role-medico: #c0392b; /* médico — red */
  --rt-role-fisico: #6f42c1; /* físico — purple */
  --rt-role-recepcao: #1f7795; /* recepção — teal */
  --rt-role-dosi: #b8860b; /* dosimetrista — gold */
  --rt-role-novo2: #4a90c9; /* role slot — light blue */

  /* ---------- Toxicity (grade 1→5, green→deep red) ---------- */
  --rt-tox-grau1: #c8e6cf;
  --rt-tox-grau2: #ffe6a8;
  --rt-tox-grau3: #f4b26c;
  --rt-tox-grau4: #e07b5c;
  --rt-tox-grau5: #871b1b;

  /* ---------- Typography ---------- */
  --rt-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --rt-font-display: 'IBM Plex Sans', 'Inter', -apple-system, sans-serif;
  --rt-font-mono: 'JetBrains Mono', 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* 1.200 minor third, anchored at 16px. UI default 14px for dense tables. */
  --rt-text-xs: 0.75rem; /* 12 */
  --rt-text-sm: 0.8125rem; /* 13 */
  --rt-text-base: 0.875rem; /* 14 — clinical density default */
  --rt-text-md: 1rem; /* 16 — body */
  --rt-text-lg: 1.125rem; /* 18 */
  --rt-text-xl: 1.375rem; /* 22 */
  --rt-text-2xl: 1.75rem; /* 28 */
  --rt-text-3xl: 2.25rem; /* 36 */
  --rt-text-4xl: 3rem; /* 48 */

  --rt-leading-tight: 1.2;
  --rt-leading-snug: 1.35;
  --rt-leading-normal: 1.55;
  --rt-leading-relaxed: 1.7;

  --rt-tracking-tight: -0.015em;
  --rt-tracking-normal: 0;
  --rt-tracking-wide: 0.02em;
  --rt-tracking-caps: 0.06em;

  /* ---------- Spacing (4px grid) ---------- */
  --rt-space-0: 0;
  --rt-space-1: 0.25rem;
  --rt-space-2: 0.5rem;
  --rt-space-3: 0.75rem;
  --rt-space-4: 1rem;
  --rt-space-5: 1.25rem;
  --rt-space-6: 1.5rem;
  --rt-space-8: 2rem;
  --rt-space-10: 2.5rem;
  --rt-space-12: 3rem;
  --rt-space-16: 4rem;
  --rt-space-20: 5rem;
  --rt-space-24: 6rem;

  /* ---------- Radius ---------- */
  --rt-radius-xs: 0.125rem; /* 2 */
  --rt-radius-sm: 0.25rem; /* 4 */
  --rt-radius-md: 0.375rem; /* 6 — controls/inputs */
  --rt-radius-lg: 0.5rem; /* 8 */
  --rt-radius-xl: 0.75rem; /* 12 — cards */
  --rt-radius-2xl: 1rem; /* 16 — windows */
  --rt-radius-pill: 9999px;

  /* ---------- Motion ---------- */
  --rt-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --rt-ease-emphasized: cubic-bezier(0.3, 0, 0, 1);
  --rt-ease-decelerate: cubic-bezier(0, 0, 0, 1);
  --rt-ease-accelerate: cubic-bezier(0.3, 0, 1, 1);

  --rt-dur-instant: 80ms;
  --rt-dur-fast: 140ms;
  --rt-dur-base: 200ms;
  --rt-dur-slow: 320ms;
  --rt-dur-slower: 480ms;
}

/* ---------- Light theme (default) ---------- */
:root,
[data-rt-theme='light'] {
  --rt-bg: var(--rt-neutral-50);
  --rt-bg-elevated: var(--rt-neutral-0);
  --rt-bg-subtle: var(--rt-neutral-100);
  --rt-bg-muted: var(--rt-neutral-150);

  --rt-fg: var(--rt-neutral-900);
  --rt-fg-muted: var(--rt-neutral-600);
  --rt-fg-subtle: var(--rt-neutral-500);
  --rt-fg-on-brand: var(--rt-neutral-0);

  --rt-border: var(--rt-neutral-200);
  --rt-border-strong: var(--rt-neutral-300);
  --rt-border-subtle: var(--rt-neutral-150);

  --rt-primary: var(--rt-navy-600);
  --rt-primary-hover: var(--rt-navy-700);
  --rt-primary-active: var(--rt-navy-800);
  --rt-primary-soft: var(--rt-navy-50);

  --rt-accent: var(--rt-teal-500);
  --rt-accent-hover: var(--rt-teal-600);
  --rt-accent-soft: var(--rt-teal-50);

  /* ---------- Famílias de indicador (categórico) ----------
     Rampa para distinguir as famílias do catálogo "Explorar indicadores".

     REGRA 1 — separação de MATIZ, priorizando os ADJACENTES. A 1ª versão saiu
     de navy+teal e virou quatro azuis (leque de 28°): nesta paleta o "teal" é
     um azul-ciano, não uma segunda matiz. A 2ª acertou o leque mas deixou o par
     mais fraco (Tempos×Taxas, 42°) justamente entre as duas primeiras seções,
     que é onde o olho compara. O que vale é a distância entre seções VIZINHAS,
     na ordem de exibição — por isso Tempos e Manuais estão trocados em relação
     à ordem "natural" de intensidade: o par fraco que restou (Taxas×Manuais)
     ficou separado por Distribuições.

       Tempos 21° · Taxas 177° · Distribuições 271° · Manuais 219°
       adjacentes: 156° · 93° · 52°   (mín. global 42°, NÃO adjacente)

     REGRA 2 — cor de PAPEL não é restrição. No caminho live ela não é token: o
     roleForStep lê config.papeis[key].cor do FlowConfig, ou seja, é dado do
     TENANT e cada clínica escolhe a sua. Não há como desviar de um alvo que o
     usuário move, e o catálogo não exibe chip de papel nenhum.

     REGRA 3 — status (success/warning/danger) SEGUE reservado, e por motivo
     diferente: "verde = bom" é leitura universal, não é configurável por
     ninguém, e status VAI conviver com estes acentos no mesmo card quando o
     veredicto de meta entrar. Cuidado específico: o terracota de Tempos fica a
     ~17° do --rt-warning-500, mas bem mais escuro e saturado — se algum dia os
     dois aparecerem lado a lado, escurecer o terracota, não clarear o âmbar. */
  /* ---------- Cor em GRÁFICOS: quatro trabalhos, nunca dois no mesmo gráfico ----
     1. CATEGÓRICA (identidade: qual série é qual)  → --rt-cat-1..6, ordem FIXA,
        atribuída em sequência, nunca ciclada; 7ª categoria em diante = --rt-cat-outros.
     2. SEQUENCIAL (magnitude: quanto)               → --rt-seq-1..4, uma matiz (teal).
     3. STATUS (bom / atenção / grave)               → success/warning/danger/info.
        RESERVADO: nunca entra num gráfico como "série 4".
     4. PAPEL (quem é responsável)                   → --rt-role-* / config do tenant.
        Só na Fila, no pipeline e no gráfico de gaps; nunca em distribuição.
     Regras: barra nominal de UMA série usa UMA cor (o comprimento já diz o valor);
     a cor segue a entidade, não a posição (filtrar não repinta as que sobram);
     ≥2 séries = legenda; texto usa tinta do tema, nunca a cor da série.
     Validado em 16/09/2026 (dataviz validate_palette): protan/deutan ≥ 8,
     visão normal ≥ 15, contraste ≥ 3:1, nos dois temas. Não reordenar sem revalidar. */
  --rt-cat-1: #2f5db0; /* azul */
  --rt-cat-2: #c0531a; /* terracota */
  --rt-cat-3: #0a9488; /* verde-azulado */
  --rt-cat-4: #7d4cac; /* violeta */
  --rt-cat-5: #bd2a72; /* rosa */
  --rt-cat-6: #94781a; /* ocre */
  --rt-cat-outros: var(--rt-neutral-500);

  /* Sequencial: claro→escuro; passo 300 é o mínimo com 2:1 sobre o card. */
  --rt-seq-1: var(--rt-teal-300);
  --rt-seq-2: var(--rt-teal-400);
  --rt-seq-3: var(--rt-teal-500);
  --rt-seq-4: var(--rt-teal-700);

  /* Gráfico de série única com item selecionado (mês clicado): a série e o
     selecionado precisam DIFERIR nos dois temas. Nunca usar --rt-accent para o
     selecionado: no claro accent == teal-500, igual às outras barras (bug antigo). */
  --rt-chart-serie: var(--rt-teal-500); /* 4,6:1 sobre branco; teal-400 lia lavado */
  --rt-chart-selecionado: var(--rt-navy-600);
  --rt-chart-meta: var(--rt-warning-500);

  /* Famílias de indicador = APELIDOS das posições categóricas (uma paleta só).
     Taxas↔Distribuições trocadas em relação à 1ª versão: na ordem em que o
     catálogo exibe (Tempos, Taxas, Distribuições, Manuais) violeta e azul
     ficavam vizinhos e falhavam na separação; com Taxas em azul passa. */
  --rt-familia-tempo: var(--rt-cat-2);
  --rt-familia-taxa: var(--rt-cat-1);
  --rt-familia-distribuicao: var(--rt-cat-3);
  --rt-familia-manual: var(--rt-cat-4);

  /* Categorias de Relatórios — ALIAS das famílias acima (paleta única, papel
     distinto: acento de SEÇÃO/card no catálogo de relatórios, nunca em série
     de gráfico). var() resolve no uso, então o tema escuro herda a versão
     clara das famílias sem re-declarar nada. */
  --rt-cat-operacional: var(--rt-familia-taxa); /* verde-azulado — operação do dia a dia */
  --rt-cat-gestao: var(--rt-familia-distribuicao); /* violeta — visão estratégica */
  --rt-cat-qualidade: var(--rt-familia-tempo); /* terracota — segurança/alerta */

  --rt-focus-ring: 0 0 0 3px color-mix(in oklch, var(--rt-teal-500) 35%, transparent);

  --rt-shadow-xs: 0 1px 2px rgba(13, 24, 51, 0.06);
  --rt-shadow-sm: 0 1px 2px rgba(13, 24, 51, 0.06), 0 1px 3px rgba(13, 24, 51, 0.04);
  --rt-shadow-md: 0 2px 4px rgba(13, 24, 51, 0.06), 0 4px 8px rgba(13, 24, 51, 0.05);
  --rt-shadow-lg: 0 4px 8px rgba(13, 24, 51, 0.06), 0 12px 24px rgba(13, 24, 51, 0.08);
  --rt-shadow-xl: 0 8px 16px rgba(13, 24, 51, 0.08), 0 24px 48px rgba(13, 24, 51, 0.1);
  --rt-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

/* ---------- Dark theme ---------- */
[data-rt-theme='dark'] {
  --rt-bg: var(--rt-neutral-950);
  --rt-bg-elevated: #131722;
  --rt-bg-subtle: #1a1f2c;
  --rt-bg-muted: #232938;

  --rt-fg: #eceef2;
  --rt-fg-muted: #a8aebc;
  --rt-fg-subtle: #828998;
  --rt-fg-on-brand: #ffffff;

  --rt-border: #2a3142;
  --rt-border-strong: #3a4253;
  --rt-border-subtle: #1f2533;

  --rt-primary: var(--rt-navy-400);
  --rt-primary-hover: var(--rt-navy-300);
  --rt-primary-active: var(--rt-navy-200);
  --rt-primary-soft: rgba(90, 127, 177, 0.12);

  --rt-accent: var(--rt-teal-300);
  --rt-accent-hover: var(--rt-teal-200);
  --rt-accent-soft: rgba(107, 177, 199, 0.12);

  /* Categórica no escuro: mesmas seis matizes, passos escolhidos para a
     superfície escura e validados como conjunto (não é inversão automática). */
  --rt-cat-1: #4577c9;
  --rt-cat-2: #d47038;
  --rt-cat-3: #1a9f92;
  --rt-cat-4: #9d7fd0;
  --rt-cat-5: #cf3f82;
  --rt-cat-6: #ad8c25;
  --rt-cat-outros: #828998;

  /* Sequencial inverte a âncora no escuro: valor baixo = passo escuro. */
  --rt-seq-1: var(--rt-teal-700);
  --rt-seq-2: var(--rt-teal-500);
  --rt-seq-3: var(--rt-teal-400);
  --rt-seq-4: var(--rt-teal-300);

  --rt-chart-serie: var(--rt-teal-400);
  --rt-chart-selecionado: var(--rt-navy-200);
  --rt-chart-meta: var(--rt-warning-500);

  --rt-focus-ring: 0 0 0 3px color-mix(in oklch, var(--rt-teal-300) 45%, transparent);

  --rt-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
  --rt-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px 3px rgba(0, 0, 0, 0.3);
  --rt-shadow-md: 0 2px 4px rgba(0, 0, 0, 0.4), 0 4px 8px rgba(0, 0, 0, 0.35);
  --rt-shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.45), 0 12px 24px rgba(0, 0, 0, 0.4);
  --rt-shadow-xl: 0 8px 16px rgba(0, 0, 0, 0.5), 0 24px 48px rgba(0, 0, 0, 0.45);
  --rt-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.04);

  /* Status brightens for dark planning rooms */
  --rt-success-500: #4caf50;
  --rt-warning-500: #f4b26c;
  --rt-danger-500: #e07b5c;
  --rt-info-500: #4a90c9;
}