is set via JS at runtime, so CSS cannot override it. * The Nginx sub_filter replaces the initial <title> tag: * sub_filter 'Novu Cloud Dashboard' 'Nexus 360 Notifications'; */

/*
 * Nexus 360 — Novu Dashboard CSS Overrides
 * Injected via Nginx sub_filter into the dashboard HTML <head>.
 * Deployed to: /opt/novu/branding/nexus-overrides.css
 *
 * How it works:
 *   Novu's dashboard uses CSS variables with raw HSL triplets (e.g., "346 73% 50%").
 *   The --novu-* palette defines the brand color; --primary aliases to --novu-500.
 *   By overriding --novu-* with Nexus 360 blue (#2563eb = 221 83% 53%), all primary
 *   buttons, links, focus rings, and accents change automatically.
 *
 * To iterate:
 *   1. Edit this file locally
 *   2. scp to VM: scp nexus-overrides.css novuadmin@20.229.42.79:/opt/novu/branding/
 *   3. Hard-refresh browser (Ctrl+Shift+R) — no Nginx reload or Docker restart needed
 */

/* ═══════════════════════════════════════════════
 * LIGHT MODE — Nexus 360 Blue Brand Palette
 * Base: #2563eb → HSL 221° 83% 53%
 * ═══════════════════════════════════════════════ */
:root {
  /* Override Novu's pink/rose palette with Nexus 360 blue */
  --novu-950: 221 83% 20%;
  --novu-800: 221 80% 35%;
  --novu-700: 221 82% 45%;
  --novu-500: 221 83% 53%;
  --novu-400: 221 83% 53% / 0.8;
  --novu-300: 221 83% 53% / 0.6;
  --novu-200: 221 83% 53% / 0.4;
  --novu-100: 221 83% 53% / 0.2;
  --novu-50: 221 83% 53% / 0.1;
  --novu-alpha-24: 221 83% 53% / 0.24;
  --novu-alpha-16: 221 83% 53% / 0.16;
  --novu-alpha-10: 221 83% 53% / 0.1;

  /* Focus ring — matches the new primary */
  --ring: var(--novu-500);
}

/* ═══════════════════════════════════════════════
 * DARK MODE — Adjusted for contrast on dark bg
 * ═══════════════════════════════════════════════ */
.dark {
  --novu-950: 221 83% 20%;
  --novu-800: 221 78% 40%;
  --novu-700: 221 80% 50%;
  --novu-500: 221 83% 60%;
  --novu-400: 221 83% 60% / 0.8;
  --novu-300: 221 83% 60% / 0.6;
  --novu-200: 221 83% 60% / 0.4;
  --novu-100: 221 83% 60% / 0.2;
  --novu-50: 221 83% 60% / 0.1;
  --novu-alpha-24: 221 83% 60% / 0.24;
  --novu-alpha-16: 221 83% 60% / 0.16;
  --novu-alpha-10: 221 83% 60% / 0.1;

  --ring: var(--novu-500);
}

/* ═══════════════════════════════════════════════
 * HARDCODED GRADIENT OVERRIDES
 * Novu uses Tailwind arbitrary values for certain
 * branded gradients (sidebar icon, onboarding).
 * These are baked into the JS/CSS bundle as:
 *   from-[#dd2476] via-[#ff512f] to-[#dd2476]
 * We override them with Nexus 360 blue gradient.
 * ═══════════════════════════════════════════════ */

/* Override Novu pink gradient start/end → Nexus blue */
.from-\[\#dd2476\] {
  --tw-gradient-from: #1d4ed8 !important;
}
.to-\[\#dd2476\] {
  --tw-gradient-to: #2563eb !important;
}
.via-\[\#ff512f\] {
  --tw-gradient-via: #3b82f6 !important;
}

/* Override Novu pink text color → Nexus blue */
.text-\[\#dd2476\] {
  color: #2563eb !important;
}
.hover\:text-\[\#dd2476\]:hover {
  color: #1d4ed8 !important;
}
[data-state=active].data-\[state\=active\]\:text-\[\#dd2476\] {
  color: #2563eb !important;
}

/* ═══════════════════════════════════════════════
 * TITLE OVERRIDE — "Nexus 360" in browser tab
 * ═══════════════════════════════════════════════ */
/* Note: <title> is set via JS at runtime, so CSS cannot override it.
 * The Nginx sub_filter replaces the initial <title> tag:
 *   sub_filter 'Novu Cloud Dashboard' 'Nexus 360 Notifications';
 */