:root {
  --fe-bg: #f8fafc;
  --fe-surface: #ffffff;
  --fe-surface-2: #f1f5f9;
  --fe-text: #0f172a;
  --fe-text-muted: #64748b;
  --fe-border: rgba(15, 23, 42, 0.12);

  --fe-primary: #28b62c; /* app green */
  --fe-danger: #ef4444;
  --fe-warning: #f59e0b;
  --fe-success: #28b62c;

  --fe-nav-bg: rgba(255, 255, 255, 0.82);
  --fe-nav-pill-bg: #f3fbf9;
  --fe-dropdown-bg: rgba(243, 251, 249, 0.96);
  --fe-link: #343836;
  --fe-link-hover: #28b62c;
}

/* Dark mode */
[data-theme="dark"] {
  --fe-bg: rgba(27, 31, 35, 0.8) !important;
  --fe-surface: #25282c;
  --fe-surface-2: #17181a;
  --fe-text: #e6edf3;
  --fe-text-muted: #9da7b1;
  --fe-border: rgba(230, 237, 243, 0.12);
  --fe-nav-bg: rgba(27, 31, 35, 0.8) !important;
  --fe-nav-pill-bg: rgba(34, 39, 46, 0.92);
  --fe-dropdown-bg: rgba(27, 31, 35, 0.96);
  --fe-link: #cdd9e5;
  --fe-link-hover: #7ee787;
}