/* ==========================================================================
   System Designer V2 — Tokens
   Fonte normativa: public/new_system_designer.html
   Os valores aqui são cópia literal do protótipo. Não aproximar.

   Só é carregado pelo layout application_v2; o V1 nunca vê este arquivo.
   ========================================================================== */

:root {
  /* Controles nativos (select/date) precisam seguir o tema do Orca, não a
     preferência escura do sistema operacional do navegador. */
  color-scheme: light;
  /* A cor da empresa entra APENAS como --brand. O canvas e os neutros
     permanecem neutros — a marca é acento, não tintura do sistema. */
  --brand: var(--primary-color, #0a84ff);
  --brand-hover: color-mix(in srgb, var(--brand) 84%, #000);
  --brand-soft: color-mix(in srgb, var(--brand) 10%, transparent);
  --brand-line: color-mix(in srgb, var(--brand) 30%, transparent);
  --brand-fg: var(--text-on-primary, #fff);

  --canvas: #f2f3f5;
  --surface: #fff;
  --surface-2: #f7f7f8;
  --surface-3: #eceef1;
  --hover: #f3f4f6;
  --line: #e2e4e8;
  --line-strong: #d2d5da;
  --text: #1d1d1f;
  --text-2: #555b65;
  --text-3: #858b95;

  /* Estados semânticos: nunca substituídos pela cor da empresa. */
  --ok: #187a43; --ok-bg: #e9f5ee; --ok-line: #b9dfc8;
  --warn: #956006; --warn-bg: #fdf3e2; --warn-line: #edd7a7;
  --danger: #c13b32; --danger-bg: #fdeceb; --danger-line: #f1c1bd;
  --info: #2469ad; --info-bg: #eaf2fb; --info-line: #bdd5ed;

  --shadow-1: 0 1px 2px rgba(18, 24, 32, .05);
  --shadow-2: 0 4px 14px rgba(18, 24, 32, .09), 0 1px 3px rgba(18, 24, 32, .05);
  --shadow-3: 0 16px 40px rgba(18, 24, 32, .14), 0 3px 8px rgba(18, 24, 32, .06);

  /* Liquid glass flat: sem sombra e sem specular decorativos. */
  --glass: rgba(255, 255, 255, .68);
  --glass-strong: rgba(255, 255, 255, .82);
  --glass-soft: rgba(255, 255, 255, .38);
  --glass-line: rgba(255, 255, 255, .78);
  --glass-ring: rgba(167, 169, 173, .38);
  --glass-shadow: none;
  --glass-specular: none;
  --glass-blur: 16px;
  --glass-saturation: 155%;
  --field-fill: rgba(255, 255, 255, .72);

  --focus: #0a84ff;
  --focus-soft: color-mix(in srgb, var(--focus) 14%, transparent);

  --r-sm: 6px; --r-md: 8px; --r-lg: 10px; --r-xl: 14px;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s8: 32px;
  --control: 36px; --row: 42px; --topbar: 52px; --sidebar: 240px;
  --sidebar-rail: 60px;

  --v2-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
  --ease: cubic-bezier(.4, 0, .2, 1);
}

/* No escuro o vidro vira preto sólido, como no protótipo. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #0b0b0d; --surface: #151518; --surface-2: #1c1c20; --surface-3: #26262c;
  --hover: #202025; --line: #29292f; --line-strong: #393940;
  --text: #f3f3f5; --text-2: #a8adb5; --text-3: #777d87;
  --ok: #49d17d; --ok-bg: #10241a; --ok-line: #204934;
  --warn: #f1b92b; --warn-bg: #281e08; --warn-line: #4c3b13;
  --danger: #f27670; --danger-bg: #2b1413; --danger-line: #4f2825;
  --info: #65a8ee; --info-bg: #102031; --info-line: #203e5e;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-2: 0 4px 14px rgba(0, 0, 0, .45);
  --shadow-3: 0 16px 40px rgba(0, 0, 0, .58);
  --glass: #000;
  --glass-strong: #000;
  --glass-soft: #000;
  --glass-line: rgba(255, 255, 255, .12);
  --glass-ring: rgba(255, 255, 255, .10);
  --glass-shadow: none;
  --glass-specular: none;
  --field-fill: #000;
}

:root[data-density="compact"] {
  --control: 32px; --row: 36px; --topbar: 48px; --s5: 16px; --s6: 20px;
}

/* ---------------------------------------------------------------------------
   Compatibilidade com telas ainda não portadas.
   O V2 não carrega app.css, mas muita tela própria de controller (dashboards,
   cadastros customizados) escreve `var(--text-main)`, `var(--text-muted)` e
   companhia direto na marcação. Sem estes apelidos essas telas renderizam com
   cor indefinida — texto invisível — dentro do shell V2.

   Isto é um apelido de variável, não um override de componente: nenhuma regra
   aqui muda a aparência de um `.v2-*`. Conforme cada tela ganha sua versão em
   `<controller>/system_v2/`, o apelido deixa de ser exercitado.
   --------------------------------------------------------------------------- */
:root {
  --text-main: var(--text);
  --text-muted: var(--text-2);
  --text-subtle: var(--text-3);
  --canvas-bg: var(--canvas);
  --surface-bg: var(--surface);
  --surface-raised-bg: var(--surface-2);
  --surface-muted-bg: var(--surface-2);
  --surface-hover-bg: var(--hover);
  --surface-border: var(--line);
  --overlay-bg: rgba(0, 0, 0, .44);
}
