/* =====================================================================
   VAI — Módulo de Campanha Profissional
   Design tokens (extraídos do VAI CRM Design System v1.0)
   ===================================================================== */

:root {
  /* Brand */
  --vai-orange:        #F87131;
  --vai-orange-hover:  #E5651F;
  --vai-orange-soft:   #FFF1EB;
  --vai-orange-tint:   rgba(248, 113, 49, 0.08);
  --vai-orange-line:   rgba(248, 113, 49, 0.22);

  /* Navy / Dark */
  --vai-navy:          #1a1a2e;
  --vai-navy-mid:      #16213e;
  --vai-navy-deep:     #0f3460;

  /* Surfaces */
  --vai-bg:            #F4F6F9;
  --vai-bg-alt:        #ECEEF3;
  --vai-surface:       #FFFFFF;
  --vai-surface-soft:  #FDFEFF;
  --vai-surface-muted: #F4F6F9;
  --vai-surface-hover: #EEF0F3;

  /* Borders */
  --vai-border:        #DCDEE2;
  --vai-border-soft:   #EEF0F3;
  --vai-border-faint:  #F5F5F8;

  /* Text */
  --vai-ink:           #1a1a2e;
  --vai-ink-strong:    #060709;
  --vai-ink-soft:      #505258;
  --vai-ink-muted:     #8080a0;
  --vai-ink-faint:     #B0B0C0;
  --vai-ink-on-dark:   #FFFFFF;

  /* Status */
  --vai-success:       #16A34A;
  --vai-success-soft:  #DCFCE7;
  --vai-warning:       #D97706;
  --vai-warning-soft:  #FEF3C7;
  --vai-danger:        #DC2626;
  --vai-danger-soft:   #FEE2E2;
  --vai-info:          #2563EB;
  --vai-info-soft:     #DBEAFE;
  --vai-neutral:       #475569;
  --vai-neutral-soft:  #E2E8F0;

  /* Channel-specific accents (subtle) */
  --vai-ch-call:       #F87131;
  --vai-ch-call-ai:    #8B5CF6;
  --vai-ch-wa-call:    #10B981;
  --vai-ch-wa:         #25D366;
  --vai-ch-wa-api:     #128C7E;
  --vai-ch-email:      #2563EB;
  --vai-ch-sms:        #F59E0B;

  /* Type scale */
  --vai-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --vai-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --vai-fs-9:  9px;
  --vai-fs-10: 10px;
  --vai-fs-11: 11px;
  --vai-fs-12: 12px;
  --vai-fs-13: 13px;
  --vai-fs-14: 14px;
  --vai-fs-15: 15px;
  --vai-fs-16: 16px;
  --vai-fs-18: 18px;
  --vai-fs-20: 20px;
  --vai-fs-24: 24px;
  --vai-fs-28: 28px;
  --vai-fs-32: 32px;

  /* Radii */
  --vai-r-2:   2px;
  --vai-r-4:   4px;
  --vai-r-6:   6px;
  --vai-r-8:   8px;
  --vai-r-10:  10px;
  --vai-r-12:  12px;
  --vai-r-16:  16px;
  --vai-r-20:  20px;
  --vai-r-pill: 9999px;

  /* Spacing */
  --vai-s-2:  2px;
  --vai-s-4:  4px;
  --vai-s-6:  6px;
  --vai-s-8:  8px;
  --vai-s-10: 10px;
  --vai-s-12: 12px;
  --vai-s-14: 14px;
  --vai-s-16: 16px;
  --vai-s-20: 20px;
  --vai-s-24: 24px;
  --vai-s-28: 28px;
  --vai-s-32: 32px;
  --vai-s-40: 40px;
  --vai-s-48: 48px;
  --vai-s-64: 64px;

  /* Elevation */
  --vai-shadow-1: 0 1px 2px rgba(15, 23, 42, 0.04);
  --vai-shadow-2: 0 2px 6px rgba(15, 23, 42, 0.05), 0 1px 2px rgba(15, 23, 42, 0.04);
  --vai-shadow-3: 0 8px 24px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04);
  --vai-shadow-4: 0 16px 48px rgba(15, 23, 42, 0.14), 0 6px 16px rgba(15, 23, 42, 0.06);
  --vai-shadow-glow: 0 0 0 4px rgba(248, 113, 49, 0.14);

  /* Layout */
  --vai-sidebar-w: 248px;
  --vai-sidebar-w-collapsed: 64px;
  --vai-topbar-h: 60px;
  --vai-content-max: 1400px;

  /* Motion */
  --vai-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --vai-dur-fast: 120ms;
  --vai-dur-base: 180ms;
  --vai-dur-slow: 280ms;

  /* Z-index */
  --vai-z-base:    1;
  --vai-z-sticky:  100;
  --vai-z-overlay: 900;
  --vai-z-modal:   1000;
  --vai-z-toast:   1100;
}

/* Dark surface override (only used inside specific dark contexts) */
.vai-on-dark {
  --vai-bg:           #0F1326;
  --vai-surface:      #161B30;
  --vai-surface-soft: #1B2138;
  --vai-border:       #2A3050;
  --vai-ink:          #F0F2F7;
  --vai-ink-soft:     #B5BBD0;
  --vai-ink-muted:    #7A8099;
}