/* ============================================================
   WiserFlow — Design Tokens
   Gerado manualmente de handoff/design-tokens.json.
   REGRA: nunca hardcode cores em Razor/CSS. Sempre var(--wf-*).
   ============================================================ */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 400;
  src: url("/fonts/Inter-400.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500;
  src: url("/fonts/Inter-500.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600;
  src: url("/fonts/Inter-600.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700;
  src: url("/fonts/Inter-700.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400;
  src: url("/fonts/JetBrainsMono-400.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 500;
  src: url("/fonts/JetBrainsMono-500.woff2") format("woff2"); font-display: swap; }

:root {
  --wf-brand-navy:        #0A1628;
  --wf-brand-navy-deep:   #050D1C;
  --wf-brand-navy-mid:    #132344;
  --wf-brand-navy-light:  #1E3A5F;
  --wf-brand-accent:      #4DA3FF;
  --wf-brand-accent-soft: #6FB8FF;
  --wf-brand-accent-deep: #2B7FD9;

  --wf-bg:              #F6F7F9;
  --wf-bg-elevated:     #FFFFFF;
  --wf-bg-sunken:       #EEF1F5;
  --wf-bg-subtle:       #EEF1F5;
  --wf-surface:         #FFFFFF;
  --wf-surface-alt:     #F9FAFB;
  --wf-border:          #E5E9EF;
  --wf-border-subtle:   #E5E9EF;
  --wf-border-strong:   #D0D7E0;
  --wf-border-focus:    #4DA3FF;

  --wf-text:            #0A1628;
  --wf-text-muted:      #4B5868;
  --wf-text-subtle:     #8590A1;
  --wf-text-dim:        #B2BBC8;

  --wf-hover:           rgba(10,22,40,0.04);
  --wf-selected:        rgba(77,163,255,0.10);
  --wf-selected-text:   #1E3A5F;

  --wf-success:         #16A34A;
  --wf-success-bg:      #ECFDF3;
  --wf-warning:         #D97706;
  --wf-warning-bg:      #FEF7E6;
  --wf-danger:          #DC2626;
  --wf-danger-bg:       #FEF2F2;
  --wf-info:            #4DA3FF;
  --wf-info-bg:         #EBF4FF;

  --wf-topbar:          #FFFFFF;
  --wf-topbar-border:   #E5E9EF;
  --wf-sidebar:         #0A1628;
  --wf-sidebar-text:    rgba(255,255,255,0.72);
  --wf-sidebar-text-active: #FFFFFF;
  --wf-sidebar-hover:   rgba(255,255,255,0.06);
  --wf-sidebar-active:  rgba(77,163,255,0.18);
  --wf-tabbar:          #F6F7F9;
  --wf-tab-active:      #FFFFFF;
  --wf-tab-hover:       #EEF1F5;

  --wf-shadow-sm:       0 1px 2px rgba(10,22,40,0.06);
  --wf-shadow-md:       0 4px 12px rgba(10,22,40,0.08);
  --wf-shadow-lg:       0 12px 32px rgba(10,22,40,0.14);

  --wf-space-0:  0;
  --wf-space-1:  4px;
  --wf-space-2:  8px;
  --wf-space-3:  12px;
  --wf-space-4:  16px;
  --wf-space-5:  20px;
  --wf-space-6:  24px;
  --wf-space-7:  32px;
  --wf-space-8:  40px;
  --wf-space-9:  48px;
  --wf-space-10: 64px;

  --wf-radius-sm:  4px;
  --wf-radius-md:  6px;
  --wf-radius-lg:  8px;
  --wf-radius-xl:  12px;
  --wf-radius-pill: 999px;

  --wf-font:      "Inter", -apple-system, system-ui, sans-serif;
  --wf-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  --wf-h-input:       36px;
  --wf-h-button:      36px;
  --wf-h-button-sm:   28px;
  --wf-h-row:         48px;
  --wf-h-row-compact: 40px;
  --wf-h-topbar:      52px;
  --wf-h-tabbar:      40px;
  --wf-h-sidebar:     56px;
}

[data-theme="dark"] {
  --wf-bg:              #070F1E;
  --wf-bg-elevated:     #0E1A2E;
  --wf-bg-sunken:       #050A15;
  --wf-bg-subtle:       #050A15;
  --wf-surface:         #101D33;
  --wf-surface-alt:     #0A1628;
  --wf-border:          #1E2B44;
  --wf-border-subtle:   #1E2B44;
  --wf-border-strong:   #2A3B58;
  --wf-border-focus:    #4DA3FF;

  --wf-text:            #E8F1FA;
  --wf-text-muted:      #9EAFC4;
  --wf-text-subtle:     #6B7C94;
  --wf-text-dim:        #4B5C75;

  --wf-hover:           rgba(255,255,255,0.04);
  --wf-selected:        rgba(77,163,255,0.16);
  --wf-selected-text:   #E8F1FA;

  --wf-success:         #22C55E;
  --wf-success-bg:      rgba(34,197,94,0.12);
  --wf-warning:         #F59E0B;
  --wf-warning-bg:      rgba(245,158,11,0.12);
  --wf-danger:          #EF4444;
  --wf-danger-bg:       rgba(239,68,68,0.12);
  --wf-info:            #4DA3FF;
  --wf-info-bg:         rgba(77,163,255,0.12);

  --wf-topbar:          #0A1628;
  --wf-topbar-border:   #1E2B44;
  --wf-sidebar:         #050D1C;
  --wf-sidebar-text:    rgba(255,255,255,0.60);
  --wf-sidebar-text-active: #FFFFFF;
  --wf-sidebar-hover:   rgba(255,255,255,0.05);
  --wf-sidebar-active:  rgba(77,163,255,0.18);
  --wf-tabbar:          #070F1E;
  --wf-tab-active:      #101D33;
  --wf-tab-hover:       #0E1A2E;

  --wf-shadow-sm:       0 1px 2px rgba(0,0,0,0.4);
  --wf-shadow-md:       0 4px 12px rgba(0,0,0,0.35);
  --wf-shadow-lg:       0 12px 32px rgba(0,0,0,0.5);
}