/* ==========================================================================
   Norte · tokens do sistema de design (a única fonte de cores, tamanhos e raios).
   Usado pelo login e pelo app. 1. Fixos   2. Modo claro/escuro   3. Cor do sistema (menu, destaque, logo, vitrine do login)
   Regra de ouro: nenhuma cor escrita fora deste arquivo. Todo o resto usa var(--…).
   ========================================================================== */
/* ---------- 1. tokens que não mudam ---------- */
:root {
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Segoe UI", system-ui, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, monospace;
  --w-texto: 400; --w-medio: 500; --w-forte: 600;   /* os mesmos pesos do menu; nada acima de 600 */
  --t-xs: 12px; --t-sm: 13.5px; --t-md: 15px; --t-lg: 17px; --t-xl: 21px; --t-2xl: 26px;   /* Norte 3 (20/10): corpo 15 px */
  --gap: 28px;           /* espaço entre blocos de uma página */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 22px; --s6: 32px;
  --r-sm: 8px;          /* itens de menu, etiquetas, chips */
  --r-md: 12px;         /* botões, campos, linhas */
  --r-lg: 14px;         /* cartões, tabelas, janelas (Norte 3: menos arredondado, mais sóbrio) */
  --bad: #D8402F; --warn: #B7791F; --on-bad: #fff; --knob: #fff; --papel: #fff; --tela-video: #000;   /* bolinha do interruptor; folha de papel nas miniaturas de PDF; fundo do vídeo */
  --scrim: rgba(8, 14, 12, .5); --tip-bg: rgba(29, 29, 31, .92); --tip-ink: #fff;   /* fundo atrás de janelas e dica de tecla */
  --ease: cubic-bezier(.2, .8, .2, 1);
}

/* ---------- 2. modo claro (padrão) e escuro ---------- */
:root {
  /* Norte 3: fundo branco e linhas finas no lugar de cartões com sombra flutuando no cinza; texto de apoio mais escuro (legível) */
  --bg: #FFFFFF; --card: #fff; --ink: #0F1720; --ink2: #353B45; --muted: #5E6570; --line: #E8EAEE; --field: #F4F5F7;
  --ring: 0 0 0 1px #E6E8EC; --halo: 0 0 0 0 transparent;
  --pane: rgba(60, 60, 67, .05); --dash: rgba(60, 60, 67, .26); --dot: rgba(60, 60, 67, .17);
  --fill-hover: rgba(60, 60, 67, .07); --fill-sel: rgba(60, 60, 67, .12);
  --pop-bg: rgba(255, 255, 255, .86); --pop-line: rgba(60, 60, 67, .13);
  --track: rgba(60, 60, 67, .13);
  --panel: rgba(60, 60, 67, .045); --panel-line: rgba(60, 60, 67, .08);   /* painel em duas camadas: fundo suave + miolo branco */
  --info: #2563D8; --saida: #B9BFCA;   /* saída de dinheiro nos gráficos: cinza neutro, a entrada usa a cor do sistema */
}
:root[data-theme="dark"] {
  --bg: #111316; --card: #15181C; --ink: #F2F4F7; --ink2: #CBD1DA; --muted: #959DAB; --line: #262A30; --field: #1C1F24;
  --ring: 0 0 0 1px rgba(255, 255, 255, .08); --halo: 0 0 0 0 transparent;
  --pane: rgba(255, 255, 255, .05); --dash: rgba(255, 255, 255, .22); --dot: rgba(255, 255, 255, .15);
  --fill-hover: rgba(255, 255, 255, .07); --fill-sel: rgba(255, 255, 255, .13);
  --pop-bg: rgba(44, 46, 51, .86); --pop-line: rgba(255, 255, 255, .1);
  --track: rgba(255, 255, 255, .14);
  --panel: rgba(255, 255, 255, .035); --panel-line: rgba(255, 255, 255, .07);
  --info: #7AA7FF; --saida: #566070;
  --bad: #FF6B5B; --warn: #E0A93B;
}

/* ---------- 3. cor do sistema: destaque + menu (+ logo) ----------
   Cada cor define: --accent (botões, links, foco), --on-accent (texto sobre ele), --soft/--accent-soft (fundos suaves),
   --nav-* (menu lateral) e --logo-* (símbolo). "branca" é o padrão: menu claro e destaque verde Norte. */
:root, [data-cor="branca"] {
  --stage-a: #12714A; --stage-b: #0A4429; --stage-c: #062A19; --stage-hi: #7CF0B0;
  --accent: #078F50; --accent-hover: #067A44; --on-accent: #fff; --soft: #DFF4E7; --accent-soft: rgba(7, 143, 80, .14);
  --nav-bg: #F7F7F8; --nav-ink: var(--ink); --nav-ink2: var(--ink2); --nav-mute: #7A7F87; --nav-line: rgba(60, 60, 67, .09);
  --nav-hover: var(--fill-hover); --nav-sel: var(--fill-sel); --nav-field: #fff; --nav-accent: var(--accent);
  --nav-av-bg: var(--soft); --nav-av-ink: var(--accent);
  --logo-tile: #078F50; --logo-n: #fff; --logo-n2: #C6EBD6;
}
[data-theme="dark"] [data-cor="branca"], [data-cor="branca"][data-theme="dark"] {
  --accent: #1EDE7B; --accent-hover: #17C96C; --on-accent: #052B16; --soft: #15291F; --accent-soft: rgba(30, 222, 123, .16);
  --nav-bg: #0D0F12; --nav-mute: #98989F; --nav-line: rgba(255, 255, 255, .08); --nav-field: rgba(255, 255, 255, .06);
}

[data-cor="verde"] {
  --stage-a: #12714A; --stage-b: #0A4429; --stage-c: #062A19; --stage-hi: #7CF0B0;
  --accent: #078F50; --accent-hover: #067A44; --on-accent: #fff; --soft: #DFF4E7; --accent-soft: rgba(7, 143, 80, .14);
  --nav-bg: #0B3D2A; --nav-ink: #fff; --nav-ink2: rgba(255, 255, 255, .84); --nav-mute: rgba(255, 255, 255, .56); --nav-line: rgba(255, 255, 255, .13);
  --nav-hover: rgba(255, 255, 255, .09); --nav-sel: rgba(255, 255, 255, .17); --nav-field: rgba(255, 255, 255, .1); --nav-accent: #8DF2BC;
  --nav-av-bg: rgba(255, 255, 255, .17); --nav-av-ink: #fff;
  --logo-tile: #fff; --logo-n: #078F50; --logo-n2: #A8DEC0;
}
[data-theme="dark"] [data-cor="verde"], [data-cor="verde"][data-theme="dark"] {
  --accent: #1EDE7B; --accent-hover: #17C96C; --on-accent: #052B16; --soft: #15291F; --accent-soft: rgba(30, 222, 123, .16);
  --nav-bg: #0A2A1E; --nav-accent: #7CF0B0;
}

[data-cor="azul"] {
  --stage-a: #2A5BC4; --stage-b: #14357F; --stage-c: #0A1C4A; --stage-hi: #B3CEFF;
  --accent: #1F5FD6; --accent-hover: #1A4FB3; --on-accent: #fff; --soft: #E1EBFC; --accent-soft: rgba(31, 95, 214, .14);
  --nav-bg: #12306F; --nav-ink: #fff; --nav-ink2: rgba(255, 255, 255, .84); --nav-mute: rgba(255, 255, 255, .58); --nav-line: rgba(255, 255, 255, .14);
  --nav-hover: rgba(255, 255, 255, .09); --nav-sel: rgba(255, 255, 255, .18); --nav-field: rgba(255, 255, 255, .1); --nav-accent: #B3CEFF;
  --nav-av-bg: rgba(255, 255, 255, .18); --nav-av-ink: #fff;
  --logo-tile: #fff; --logo-n: #1F5FD6; --logo-n2: #A9C4F5;
}
[data-theme="dark"] [data-cor="azul"], [data-cor="azul"][data-theme="dark"] {
  --accent: #6FA2FF; --accent-hover: #5A90F5; --on-accent: #07173A; --soft: #16223F; --accent-soft: rgba(111, 162, 255, .18);
  --nav-bg: #0E1B3D; --nav-accent: #A9C7FF;
}

[data-cor="rosa"] {
  --stage-a: #D12A74; --stage-b: #951D52; --stage-c: #5C0F31; --stage-hi: #FFD0E3;
  --accent: #CC2A6E; --accent-hover: #B0205D; --on-accent: #fff; --soft: #FBE3EE; --accent-soft: rgba(204, 42, 110, .13);
  --nav-bg: #A81F58; --nav-ink: #fff; --nav-ink2: rgba(255, 255, 255, .88); --nav-mute: rgba(255, 255, 255, .64); --nav-line: rgba(255, 255, 255, .17);
  --nav-hover: rgba(255, 255, 255, .11); --nav-sel: rgba(255, 255, 255, .21); --nav-field: rgba(255, 255, 255, .12); --nav-accent: #FFD0E3;
  --nav-av-bg: rgba(255, 255, 255, .2); --nav-av-ink: #fff;
  --logo-tile: #fff; --logo-n: #CC2A6E; --logo-n2: #F2B3CD;
}
[data-theme="dark"] [data-cor="rosa"], [data-cor="rosa"][data-theme="dark"] {
  --accent: #FF6FA8; --accent-hover: #FF5A9B; --on-accent: #3A0A20; --soft: #3A1626; --accent-soft: rgba(255, 111, 168, .18);
  --nav-bg: #3A0F26; --nav-accent: #FFB3D1;
}

[data-cor="preta"] {
  --stage-a: #4A4D55; --stage-b: #24262B; --stage-c: #0C0C0E; --stage-hi: #FFFFFF;
  --accent: #17181C; --accent-hover: #000; --on-accent: #fff; --soft: #E9EAEE; --accent-soft: rgba(23, 24, 28, .1);
  --nav-bg: #121316; --nav-ink: #fff; --nav-ink2: rgba(255, 255, 255, .84); --nav-mute: rgba(255, 255, 255, .54); --nav-line: rgba(255, 255, 255, .11);
  --nav-hover: rgba(255, 255, 255, .08); --nav-sel: rgba(255, 255, 255, .15); --nav-field: rgba(255, 255, 255, .08); --nav-accent: #fff;
  --nav-av-bg: rgba(255, 255, 255, .16); --nav-av-ink: #fff;
  --logo-tile: #fff; --logo-n: #17181C; --logo-n2: #A7ADB8;
}
[data-theme="dark"] [data-cor="preta"], [data-cor="preta"][data-theme="dark"] {
  --accent: #F2F4F7; --accent-hover: #fff; --on-accent: #111214; --soft: #25272C; --accent-soft: rgba(242, 244, 247, .14);
  --nav-bg: #08090A;
}

/* cores das etiquetas (a mesma paleta no sistema inteiro) */
.et-cinza { --c: #5B6472; } .et-vermelho { --c: #D13B2C; } .et-laranja { --c: #C75A0B; } .et-amarelo { --c: #A16207; }
.et-verde { --c: #0F8A4B; } .et-azul { --c: #2563D8; } .et-roxo { --c: #7C3AED; } .et-rosa { --c: #D6246E; }
:root[data-theme="dark"] .et-cinza { --c: #AEB6C2; } :root[data-theme="dark"] .et-vermelho { --c: #FF7B6E; } :root[data-theme="dark"] .et-laranja { --c: #FFA45C; }
:root[data-theme="dark"] .et-amarelo { --c: #F2C94C; } :root[data-theme="dark"] .et-verde { --c: #3DDC84; } :root[data-theme="dark"] .et-azul { --c: #7AA7FF; }
:root[data-theme="dark"] .et-roxo { --c: #B79BFF; } :root[data-theme="dark"] .et-rosa { --c: #FF7BAE; }