/*
 * Tema do painel (T-117; D82): os tokens --tx-* do design system da Tenex como a CMP Business
 * os implementa (lidos em 23/10/2026; ligar isso ao Manual da Marca v1.0 é PROPOSTA até o
 * 00-decisoes.md registrar a leitura, e o claro com superfície #fff contraria o 07 §2,
 * PROPOSTA apoiada na D82, "fundo branco", e na MRC-15). Nomes e valores copiados da CMP, sem nenhum valor novo: a paleta, as fontes,
 * a escala, os pesos, os espaços, os raios, o tempo e os papéis dos temas escuro e claro.
 * Carrega depois de marca/tokens.css e antes de painel.css, que só usa estes tokens e as
 * medidas --painel-* do fim (nenhuma cor literal em painel.css).
 *
 * PROPOSTA (para o responsável aprovar na demonstração; MRC-01, MRC-04, MRC-05, MRC-07,
 * MRC-15): as medidas --painel-* observadas na CMP que não são token (menu de 248 px,
 * cabeçalho de 60 px, raio de 6 px, texto do menu de 13,5 px, botão de 12 px, campo de
 * 12,5 px) e os três papéis do painel (fundo do item ativo, cabeçalho da tabela e borda de
 * campo), todos feitos só de --tx-*. As cores de erro (--tx-danger*) ficam definidas, mas
 * nenhum status as usa: as cores semânticas seguem PENDENTES (MRC-01).
 *
 * PROPOSTA também (revisão do PR #109; MRC-01, MRC-02, MRC-15): as cores da CMP que ficam
 * fora da paleta da UI-004 (CONFIRMADO na D82: preto, grafite, off-white, linha e aço) e da
 * UI-006 (o LED #34D27B). "Nenhuma cor nova" vale só em relação à CMP. No claro: a
 * superfície #fff, o quadradinho de operando #1f9e5a (e não o #34D27B da UI-006), a borda
 * #dcd9d0, a border-strong #b9b5aa, o texto secundário #5d6167 e a zebra #0000000a. No
 * escuro: #1e1f23 (surface-raised: o fundo do item ativo e do cabeçalho da tabela),
 * #5d6167 (fg-subtle: o quadradinho dos outros status, a seta e a sigla), #3a3b41
 * (border-strong: a barra de rolagem) e a zebra #ffffff09.
 */

:root {
  --tx-palette-black: #0c0c0e;
  --tx-palette-amber: #ffc400;
  --tx-palette-graphite: #17181b;
  --tx-palette-offwhite: #f3f1ea;
  --tx-palette-steel: #8b9096;
  --tx-palette-amber-dark: #b78c00;
  --tx-palette-led: #34d27b;
  --tx-palette-line: #2a2b30;
  --tx-palette-white: #fff;
  --tx-palette-danger: #e5484d;
  --tx-font-mono: "IBM Plex Mono", Consolas, "Courier New", monospace;
  --tx-font-display: "Space Grotesk", Arial, Helvetica, sans-serif;
  --tx-font-text: "Inter", Arial, Helvetica, sans-serif;
  --tx-text-xs: .6875rem;
  --tx-text-sm: .8125rem;
  --tx-text-md: .875rem;
  --tx-text-lg: 1rem;
  --tx-text-xl: 1.25rem;
  --tx-text-2xl: 1.75rem;
  --tx-text-3xl: 2.25rem;
  --tx-text-4xl: 3rem;
  --tx-text-5xl: 4.5rem;
  --tx-leading-tight: 1.1;
  --tx-leading-snug: 1.25;
  --tx-leading-body: 1.6;
  --tx-tracking-label: .12em;
  --tx-tracking-tight: -.02em;
  --tx-weight-regular: 400;
  --tx-weight-medium: 500;
  --tx-weight-semibold: 600;
  --tx-weight-bold: 700;
  --tx-space-1: .25rem;
  --tx-space-2: .5rem;
  --tx-space-3: .75rem;
  --tx-space-4: 1rem;
  --tx-space-5: 1.25rem;
  --tx-space-6: 1.5rem;
  --tx-space-8: 2rem;
  --tx-space-10: 2.5rem;
  --tx-space-12: 3rem;
  --tx-space-16: 4rem;
  --tx-radius-sm: 4px;
  --tx-radius-md: 8px;
  --tx-radius-lg: 12px;
  --tx-radius-square: 22%;
  --tx-border-width: 1px;
  --tx-duration-fast: .12s;
  --tx-duration-base: .2s;
  --tx-ease: cubic-bezier(.2, 0, 0, 1);
  --tx-focus-ring: 0 0 0 2px var(--tx-bg), 0 0 0 4px var(--tx-accent);
}

:root,
[data-tx-theme="dark"] {
  color-scheme: dark;
  --tx-bg: var(--tx-palette-black);
  --tx-surface: var(--tx-palette-graphite);
  --tx-surface-raised: #1e1f23;
  --tx-border: var(--tx-palette-line);
  --tx-border-strong: #3a3b41;
  --tx-fg: var(--tx-palette-offwhite);
  --tx-fg-muted: var(--tx-palette-steel);
  --tx-fg-subtle: #5d6167;
  --tx-accent: var(--tx-palette-amber);
  --tx-accent-hover: #ffd23d;
  --tx-accent-fg: var(--tx-palette-black);
  --tx-accent-soft: #ffc4001f;
  --tx-status-on: var(--tx-palette-led);
  --tx-danger: #e5484d;
  --tx-danger-soft: #e5484d24;
  --tx-grid-line: #ffffff09;
  /* Papéis do painel (PROPOSTA), só de --tx-*: o fundo do item ativo do menu e o do
     cabeçalho da tabela. */
  --painel-menu-ativo: var(--tx-surface-raised);
  --painel-cabecalho-tabela: var(--tx-surface-raised);
}

[data-tx-theme="light"] {
  color-scheme: light;
  --tx-bg: var(--tx-palette-offwhite);
  --tx-surface: #fff;
  --tx-surface-raised: #fff;
  --tx-border: #dcd9d0;
  --tx-border-strong: #b9b5aa;
  --tx-fg: var(--tx-palette-black);
  --tx-fg-muted: #5d6167;
  --tx-fg-subtle: var(--tx-palette-steel);
  --tx-accent: var(--tx-palette-amber-dark);
  --tx-accent-hover: #a07b00;
  --tx-accent-fg: var(--tx-palette-black);
  --tx-accent-soft: #b78c0024;
  --tx-status-on: #1f9e5a;
  --tx-danger: #c8383d;
  --tx-danger-soft: #c8383d1f;
  --tx-grid-line: #0000000a;
  --tx-focus-ring: 0 0 0 2px var(--tx-bg), 0 0 0 4px var(--tx-palette-black);
  /* No claro, a superfície elevada é o próprio branco: o ativo e o cabeçalho usam o fundo. */
  --painel-menu-ativo: var(--tx-bg);
  --painel-cabecalho-tabela: var(--tx-bg);
}

:root {
  /* Medidas da CMP que não são token (PROPOSTA; MRC-05, MRC-07). */
  --painel-lateral: 248px;
  --painel-topo: 60px;
  --painel-item: 36px;
  --painel-campo: 34px;
  --painel-botao: 32px;
  --painel-raio-controle: 6px;
  --painel-texto-menu: 13.5px;
  --painel-texto-campo: 12.5px;
  --painel-texto-pequeno: 12px;
  /* Borda de campo (PROPOSTA; MRC-04): o texto secundário, que passa de 3:1 em todo fundo
     dos dois temas (a border-strong da CMP fica abaixo de 3:1; WCAG 1.4.11). */
  --painel-borda-campo: var(--tx-fg-muted);
}