/* TuNF · Painel do cliente v2 · tokens
   Registrar no AppPanelProvider via FilamentAsset (Css::make('tunf-tokens', ...)).
   Só variáveis CSS: sem @apply, sem utilitárias. Claro em :root, escuro em .dark
   (classe que o Filament aplica na raiz). Seletores sobre .fi-* ficam em painel.css. */

:root {
  /* Marca (imutável) */
  --tn-brand: #34d399;            /* emerald-400: logo, destaque */
  --tn-brand-ink: #022c22;        /* texto sobre a marca */

  /* Primária: ações */
  --tn-primary: #047857;          /* emerald-700: texto branco 5.5:1 */
  --tn-primary-hover: #065f46;
  --tn-primary-fg: #ffffff;
  --tn-primary-soft: #ecfdf5;
  --tn-primary-soft-fg: #047857;

  /* Neutros (zinc) */
  --tn-bg: #f6f6f7;
  --tn-surface: #ffffff;
  --tn-surface-2: #f4f4f5;
  --tn-surface-3: #e4e4e7;
  --tn-sidebar-bg: #fbfbfc;
  --tn-border: #e7e7ea;
  --tn-border-strong: #d4d4d8;
  --tn-text: #18181b;
  --tn-text-2: #52525b;
  --tn-text-3: #71717a;
  --tn-hover: #f4f4f5;
  --tn-chart: #d4d4d8;
  --tn-skeleton: #ececef;
  --tn-overlay: rgba(24, 24, 27, .32);

  /* Semânticas: cor só com significado */
  --tn-success: #10b981;  --tn-success-soft: #ecfdf5;  --tn-success-fg: #047857;
  --tn-warning: #f59e0b;  --tn-warning-soft: #fffbeb;  --tn-warning-fg: #b45309;
  --tn-danger: #f43f5e;   --tn-danger-soft: #fff1f2;   --tn-danger-fg: #be123c;
  --tn-info: #0ea5e9;     --tn-info-soft: #f0f9ff;     --tn-info-fg: #0369a1;
  --tn-neutral: #a1a1aa;  --tn-neutral-soft: #f4f4f5;  --tn-neutral-fg: #52525b;

  /* Tipografia: uma família (Inter, decisão de 2026-09-25 na SPEC-0026), números tabulares em valores */
  --tn-font: 'Inter', ui-sans-serif, system-ui, sans-serif;
  --tn-fs-xs: 12px;
  --tn-fs-sm: 13px;
  --tn-fs-base: 14px;
  --tn-fs-md: 15px;
  --tn-fs-lg: 17px;
  --tn-fs-xl: 20px;
  --tn-fs-2xl: 28px;
  --tn-fs-num: 26px;
  --tn-fw-regular: 400;
  --tn-fw-medium: 500;
  --tn-fw-semibold: 600;
  --tn-lh: 1.5;
  --tn-lh-tight: 1.2;
  --tn-tracking-tight: -0.02em;

  /* Raio */
  --tn-r-xs: 6px;
  --tn-r-sm: 8px;
  --tn-r-control: 10px;
  --tn-r-md: 12px;
  --tn-r-lg: 16px;
  --tn-r-pill: 999px;

  /* Sombra */
  --tn-shadow-sm: 0 1px 2px rgba(24, 24, 27, .05);
  --tn-shadow-md: 0 4px 12px -2px rgba(24, 24, 27, .08), 0 1px 3px rgba(24, 24, 27, .06);
  --tn-shadow-lg: 0 24px 48px -12px rgba(24, 24, 27, .22), 0 2px 6px rgba(24, 24, 27, .06);

  /* Espaçamento (base 4) */
  --tn-s-1: 4px;  --tn-s-2: 8px;  --tn-s-3: 12px; --tn-s-4: 16px;
  --tn-s-5: 20px; --tn-s-6: 24px; --tn-s-8: 32px; --tn-s-10: 40px;

  /* Densidade e layout */
  --tn-control-h: 36px;
  --tn-control-h-touch: 44px;
  --tn-row-h: 56px;
  --tn-nav-item-h: 34px;
  --tn-sidebar-w: 248px;
  --tn-drawer-w: 480px;
  --tn-content-max: 1200px;
  --tn-page-pad: 32px;
  --tn-page-pad-mobile: 16px;
}

.dark {
  --tn-primary: #34d399;
  --tn-primary-hover: #6ee7b7;
  --tn-primary-fg: #022c22;
  --tn-primary-soft: rgba(52, 211, 153, .12);
  --tn-primary-soft-fg: #6ee7b7;

  --tn-bg: #09090b;               /* zinc-950, igual ao "Esmeralda noite" */
  --tn-surface: #111113;
  --tn-surface-2: #18181b;
  --tn-surface-3: #27272a;
  --tn-sidebar-bg: #0c0c0e;
  --tn-border: #222226;
  --tn-border-strong: #3a3a41;
  --tn-text: #fafafa;
  --tn-text-2: #a1a1aa;
  --tn-text-3: #8b8b94;
  --tn-hover: #18181b;
  --tn-chart: #2e2e34;
  --tn-skeleton: #1d1d21;
  --tn-overlay: rgba(0, 0, 0, .6);

  --tn-success: #34d399;  --tn-success-soft: rgba(52, 211, 153, .12);  --tn-success-fg: #6ee7b7;
  --tn-warning: #fbbf24;  --tn-warning-soft: rgba(251, 191, 36, .12);  --tn-warning-fg: #fcd34d;
  --tn-danger: #fb7185;   --tn-danger-soft: rgba(251, 113, 133, .12);  --tn-danger-fg: #fda4af;
  --tn-info: #38bdf8;     --tn-info-soft: rgba(56, 189, 248, .12);     --tn-info-fg: #7dd3fc;
  --tn-neutral: #71717a;  --tn-neutral-soft: #1f1f23;                  --tn-neutral-fg: #a1a1aa;

  --tn-shadow-sm: 0 0 0 1px rgba(255, 255, 255, .02);
  --tn-shadow-md: 0 8px 24px -6px rgba(0, 0, 0, .6);
  --tn-shadow-lg: 0 24px 64px -12px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 255, 255, .06);
}
