/* SYTHAXSYSTEM — Design tokens Sythax Signal (fintech operacional) */
:root {
  color-scheme: light;

  /* Marca — azul do cubo oficial + teal de recompensa */
  --ss-primary: #1b365d;
  --ss-primary-hover: #152b48;
  --ss-primary-deep: #0f2a4a;
  --ss-primary-soft: #eef3f8;
  --ss-primary-muted: #d5e0ec;
  --ss-primary-ring: rgba(27, 54, 93, 0.22);
  --ss-signal: #5b8fb9;
  --ss-signal-hover: #4a7aa3;
  --ss-signal-soft: #eaf3f9;
  --ss-accent-sky: #8ab9d5;
  /* Atmosfera — calma, com um fio de luz da marca (não mesh SaaS) */
  --ss-app-bg: #f1f4f8;
  --ss-app-atmosphere:
    radial-gradient(ellipse 90% 55% at 0% -10%, rgba(138, 185, 213, 0.22) 0%, transparent 55%),
    radial-gradient(ellipse 60% 40% at 100% 0%, rgba(27, 54, 93, 0.06) 0%, transparent 50%),
    linear-gradient(180deg, #eef3f8 0%, #f1f4f8 42%, #f5f7fa 100%);

  /* Neutros */
  --ss-bg: #ffffff;
  --ss-bg-subtle: #f4f6f9;
  --ss-bg-muted: #e6ebf2;
  --ss-bg-elevated: #ffffff;
  --ss-border: #d5dce6;
  --ss-border-strong: #aeb8c8;
  --ss-text: #0b1220;
  --ss-text-secondary: #3a4860;
  --ss-text-muted: #64748b;

  /* Recompensa / sinal (dopamina pontual) */
  --ss-reward: #8ab9d5;
  --ss-reward-deep: #5b8fb9;
  --ss-reward-line: linear-gradient(90deg, transparent, #8ab9d5 35%, #5b8fb9 65%, transparent);

  /* Sombras — só profundidade útil (modal / foco), nunca card flutuante */
  --ss-shadow-xs: none;
  --ss-shadow-sm: 0 1px 0 rgba(27, 54, 93, 0.04);
  --ss-shadow: none;
  --ss-shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.1);
  --ss-shadow-xl: 0 20px 48px rgba(15, 23, 42, 0.12);
  --ss-shadow-card: none;

  /* Layout app — rail + flyout Sythax */
  --ss-nav-rail-w: 76px;
  --ss-nav-flyout-w: 280px;
  --ss-sidebar-w: var(--ss-nav-rail-w);
  --ss-sidebar-w-expanded: calc(var(--ss-nav-rail-w) + var(--ss-nav-flyout-w));
  --ss-sidebar-w-collapsed: 72px;
  --ss-sidebar-current-w: var(--ss-sidebar-w);

  /* Centrais modulares (hub + flyout) */
  --ss-hub-pad-x: clamp(28px, 3.5vw, 52px);
  --ss-hub-pad-x-flyout: clamp(44px, 5.5vw, 80px);
  --ss-hub-grid-gap: 24px;
  --ss-hub-card-min: 196px;

  /* Semânticos */
  --ss-success: #059669;
  --ss-success-soft: #ecfdf5;
  --ss-warning: #d97706;
  --ss-warning-soft: #fffbeb;
  --ss-danger: #dc2626;
  --ss-danger-soft: #fef2f2;

  /* Tipografia — Sora nos títulos (marca), Inter no corpo (piso legível) */
  --ss-font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --ss-font-display: "Sora", var(--ss-font);
  --ss-text-body: 0.9375rem; /* 15px — nunca abaixo em massa */
  --ss-text-label: 0.75rem; /* 12px — mínimo de label */
  --ss-text-title: 1.125rem;

  /* Departamentos — identidade visual por módulo (dopamina sem saturar) */
  --ss-dept-inicio: #1b365d;
  --ss-dept-inicio-soft: #eef3f8;
  --ss-dept-inicio-ink: #0f2a4a;

  --ss-dept-vendas: #2563eb;
  --ss-dept-vendas-soft: #dbeafe;
  --ss-dept-vendas-ink: #1d4ed8;

  --ss-dept-compras: #d97706;
  --ss-dept-compras-soft: #fef3c7;
  --ss-dept-compras-ink: #b45309;

  --ss-dept-financeiro: #0f766e;
  --ss-dept-financeiro-soft: #ccfbf1;
  --ss-dept-financeiro-ink: #0f766e;

  --ss-dept-estoque: #e11d48;
  --ss-dept-estoque-soft: #ffe4e6;
  --ss-dept-estoque-ink: #be123c;

  --ss-dept-cadastros: #7c3aed;
  --ss-dept-cadastros-soft: #ede9fe;
  --ss-dept-cadastros-ink: #6d28d9;

  --ss-dept-produtos: #4f46e5;
  --ss-dept-produtos-soft: #e0e7ff;
  --ss-dept-produtos-ink: #4338ca;

  --ss-dept-relatorios: #9333ea;
  --ss-dept-relatorios-soft: #f3e8ff;
  --ss-dept-relatorios-ink: #7e22ce;

  --ss-dept-ajustes: #475569;
  --ss-dept-ajustes-soft: #e2e8f0;
  --ss-dept-ajustes-ink: #334155;

  --ss-dept-nfe: #2563eb;
  --ss-dept-nfe-soft: #dbeafe;
  --ss-dept-nfe-ink: #1d4ed8;

  --ss-dept-fiscal: #1d4ed8;
  --ss-dept-fiscal-soft: #dbeafe;
  --ss-dept-fiscal-ink: #1e3a8a;

  /* Acento ativo do módulo (router define via data-ss-dept) */
  --ss-dept: var(--ss-dept-inicio);
  --ss-dept-soft: var(--ss-dept-inicio-soft);
  --ss-dept-ink: var(--ss-dept-inicio-ink);

  /* Raio — cantos firmes */
  --ss-radius-sm: 4px;
  --ss-radius: 6px;
  --ss-radius-lg: 8px;
  --ss-radius-xl: 10px;
  --ss-radius-full: 9999px;

  /* Motion — prazer sem ruído */
  --ss-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ss-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ss-duration: 180ms;
  --ss-duration-slow: 280ms;
  --ss-duration-enter: 420ms;

  --ss-topbar-h: 54px;
  --ss-utility-bar-h: 30px;

  /* Aliases legado (compatibilidade) */
  --blue-950: #0a1628;
  --blue-900: #0f2744;
  --blue-800: #1e3a5f;
  --blue-700: var(--ss-primary-hover);
  --blue-600: var(--ss-primary);
  --blue-500: #3b82f6;
  --blue-100: var(--ss-primary-muted);
  --blue-50: var(--ss-primary-soft);
  --slate-900: var(--ss-text);
  --slate-700: #334155;
  --slate-600: var(--ss-text-secondary);
  --slate-500: var(--ss-text-muted);
  --slate-200: var(--ss-border);
  --slate-100: var(--ss-bg-muted);
  --slate-50: var(--ss-bg-subtle);
  --white: #ffffff;
  --green-ok: var(--ss-success);
  --radius: var(--ss-radius);
  --radius-lg: var(--ss-radius-xl);
  --shadow: var(--ss-shadow);
  --shadow-lg: var(--ss-shadow-lg);
}