:root {
  --sp-brand-primary: #4f46e5;
  --sp-brand-accent: #10b981;
  --sp-brand-primary-text: #ffffff;
  --sp-brand-accent-text: #ffffff;
  --sp-brand-sidebar-bg: #0f172a;
  --sp-brand-sidebar-footer: #0b1120;
  --sp-brand-sidebar-text: #f8fafc;
  --sp-brand-sidebar-muted: #94a3b8;
  --sp-brand-footer-text: #f8fafc;
  --sp-brand-nav-active: #4f46e5;
  --sp-brand-primary-soft: #eef2ff;
  --sp-brand-accent-soft: #ecfdf5;
  --sp-brand-primary-border: #c7d2fe;
  --sp-brand-accent-border: #a7f3d0;
}

/* Utility classes (work with or without Tailwind brand.*) */
.sp-bg-primary {
  background-color: var(--sp-brand-primary) !important;
  color: var(--sp-brand-primary-text) !important;
}
.sp-bg-accent {
  background-color: var(--sp-brand-accent) !important;
  color: var(--sp-brand-accent-text) !important;
}
.sp-text-primary {
  color: var(--sp-brand-primary) !important;
}
.sp-text-accent {
  color: var(--sp-brand-accent) !important;
}
.sp-border-primary {
  border-color: var(--sp-brand-primary-border) !important;
}
.sp-border-accent {
  border-color: var(--sp-brand-accent-border) !important;
}
.sp-bg-primary-soft {
  background-color: var(--sp-brand-primary-soft) !important;
}
.sp-bg-accent-soft {
  background-color: var(--sp-brand-accent-soft) !important;
}

/* App-wide remap when custom brand is active — tabs, buttons, and primary chrome only */
[data-brand-scope][data-brand-active='true'] .bg-indigo-600,
[data-brand-scope][data-brand-active='true'] .bg-indigo-700,
[data-brand-scope][data-brand-active='true'] .hover\:bg-indigo-700:hover,
[data-brand-scope][data-brand-active='true'] .bg-slate-900,
[data-brand-scope][data-brand-active='true'] .hover\:bg-slate-800:hover {
  background-color: var(--sp-brand-primary) !important;
  color: var(--sp-brand-primary-text) !important;
}

[data-brand-scope][data-brand-active='true'] .text-indigo-600,
[data-brand-scope][data-brand-active='true'] .text-indigo-700,
[data-brand-scope][data-brand-active='true'] .text-indigo-800,
[data-brand-scope][data-brand-active='true'] .text-indigo-500 {
  color: var(--sp-brand-primary) !important;
}

[data-brand-scope][data-brand-active='true'] .bg-indigo-50,
[data-brand-scope][data-brand-active='true'] .bg-indigo-50\/50,
[data-brand-scope][data-brand-active='true'] .bg-indigo-50\/60,
[data-brand-scope][data-brand-active='true'] .hover\:bg-indigo-50:hover,
[data-brand-scope][data-brand-active='true'] .hover\:bg-indigo-50\/50:hover {
  background-color: var(--sp-brand-primary-soft) !important;
}

[data-brand-scope][data-brand-active='true'] .border-indigo-100,
[data-brand-scope][data-brand-active='true'] .border-indigo-200,
[data-brand-scope][data-brand-active='true'] .border-indigo-300,
[data-brand-scope][data-brand-active='true'] .border-indigo-500,
[data-brand-scope][data-brand-active='true'] .border-indigo-600,
[data-brand-scope][data-brand-active='true'] .border-indigo-700,
[data-brand-scope][data-brand-active='true'] .ring-indigo-100,
[data-brand-scope][data-brand-active='true'] .ring-indigo-300,
[data-brand-scope][data-brand-active='true'] .hover\:border-indigo-100:hover,
[data-brand-scope][data-brand-active='true'] .hover\:border-indigo-200:hover,
[data-brand-scope][data-brand-active='true'] .hover\:border-indigo-300:hover,
[data-brand-scope][data-brand-active='true'] .hover\:border-indigo-500:hover,
[data-brand-scope][data-brand-active='true'] .hover\:border-indigo-600:hover {
  border-color: var(--sp-brand-primary-border) !important;
}

[data-brand-scope][data-brand-active='true'] .bg-indigo-600.border-indigo-600,
[data-brand-scope][data-brand-active='true'] .bg-indigo-600.border-indigo-700,
[data-brand-scope][data-brand-active='true'] .bg-indigo-700.border-indigo-600,
[data-brand-scope][data-brand-active='true'] .bg-indigo-700.border-indigo-700 {
  border-color: var(--sp-brand-primary) !important;
}

[data-brand-scope][data-brand-active='true'] .ring-indigo-100,
[data-brand-scope][data-brand-active='true'] .ring-indigo-300,
[data-brand-scope][data-brand-active='true'] .focus\:ring-indigo-100:focus,
[data-brand-scope][data-brand-active='true'] .focus\:ring-indigo-300:focus {
  --tw-ring-color: var(--sp-brand-primary-border) !important;
}

/* Semantic / state UI — opt in via data-brand-preserve (metrics, banners, dark summary panels).
   Tone classes must sit on a descendant inside [data-brand-preserve], not on the same node.
   Emerald, amber, rose, etc. are never remapped globally; preserve restores tones when nested
   inside remapped parents (e.g. metric cards with indigo tone, inverse slate-900 sections). */
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-emerald-50 {
  background-color: #ecfdf5 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-emerald-600 {
  background-color: #059669 !important;
  color: #ffffff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-50 {
  background-color: #fffbeb !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-emerald-700 {
  color: #047857 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-emerald-900 {
  color: #064e3b !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-amber-800 {
  color: #92400e !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-emerald-200 {
  border-color: #a7f3d0 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-amber-200 {
  border-color: #fde68a !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .hover\:bg-emerald-700:hover {
  background-color: #047857 !important;
  color: #ffffff !important;
}

/* Inside preserve zones: keep metric tone indigo + dark summary panels off brand primary */
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-50,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-50\/50,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-50\/60,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-50\/70,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-50\/40 {
  background-color: #eef2ff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-100\/80 {
  background-color: #e0e7ff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-500,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-600,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-indigo-700,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .hover\:bg-indigo-700:hover {
  background-color: #4f46e5 !important;
  color: #ffffff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-indigo-500,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-indigo-600,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-indigo-700,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-indigo-800 {
  color: #4338ca !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-indigo-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-indigo-200,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-indigo-300,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .ring-indigo-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .ring-indigo-300 {
  border-color: #c7d2fe !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-slate-900,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .hover\:bg-slate-800:hover {
  background-color: #0f172a !important;
  color: #f8fafc !important;
}

/* Semantic state tones (risk, pulse outcome, initiative status, etc.) */
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-emerald-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-emerald-50\/40,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-emerald-50\/60,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-emerald-50\/70 {
  background-color: #d1fae5 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-emerald-500,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-emerald-600 {
  background-color: #10b981 !important;
  color: #ffffff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-emerald-600,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-emerald-800,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-emerald-300 {
  color: #047857 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-emerald-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-emerald-200 {
  border-color: #a7f3d0 !important;
}

[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-50,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-50\/40,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-50\/90 {
  background-color: #fef3c7 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-400,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-500,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-600,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .hover\:bg-amber-700:hover {
  background-color: #f59e0b !important;
  color: #ffffff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-amber-700,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-amber-900,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-amber-400 {
  color: #b45309 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-amber-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-amber-200 {
  border-color: #fde68a !important;
}

[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-rose-50,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-rose-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-rose-50\/40,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-rose-50\/60,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-rose-50\/90 {
  background-color: #ffe4e6 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-rose-500,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-rose-600,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-rose-700,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .hover\:bg-rose-700:hover {
  background-color: #e11d48 !important;
  color: #ffffff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-rose-600,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-rose-700,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-rose-800 {
  color: #be123c !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-rose-100,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-rose-200 {
  border-color: #fecdd3 !important;
}

[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-lime-100 {
  background-color: #ecfccb !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-lime-700 {
  color: #4d7c0f !important;
}

[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-orange-100 {
  background-color: #ffedd5 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-orange-700 {
  color: #c2410c !important;
}

[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-violet-50 {
  background-color: #f5f3ff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-violet-700 {
  color: #6d28d9 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-violet-100 {
  border-color: #ede9fe !important;
}

[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-blue-50 {
  background-color: #eff6ff !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-blue-500,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-blue-900 {
  color: #1d4ed8 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-blue-100 {
  border-color: #dbeafe !important;
}

[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .bg-amber-100 {
  background-color: #fef3c7 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-amber-500,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-amber-600 {
  color: #d97706 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-amber-100 {
  border-color: #fde68a !important;
}

[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-emerald-500 {
  color: #10b981 !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-rose-500,
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .text-rose-900 {
  color: #be123c !important;
}
[data-brand-scope][data-brand-active='true'] [data-brand-preserve] .border-rose-100 {
  border-color: #ffe4e6 !important;
}

[data-brand-scope][data-brand-active='true'] .group-hover\:bg-indigo-600.group:hover,
[data-brand-scope][data-brand-active='true'] .group-hover\:text-indigo-600.group:hover .group-hover\:text-indigo-600,
[data-brand-scope][data-brand-active='true'] .group-hover\:border-indigo-300.group:hover {
  background-color: var(--sp-brand-primary) !important;
  color: var(--sp-brand-primary-text) !important;
  border-color: var(--sp-brand-primary-border) !important;
}

/* Focus rings and highlight borders — remap default Pulse indigo/blue chrome to brand */
[data-brand-scope][data-brand-active='true'] .focus\:ring-indigo-50:focus,
[data-brand-scope][data-brand-active='true'] .focus\:ring-indigo-100:focus,
[data-brand-scope][data-brand-active='true'] .focus\:ring-indigo-500:focus,
[data-brand-scope][data-brand-active='true'] .focus\:ring-indigo-500\/50:focus {
  --tw-ring-color: color-mix(in srgb, var(--sp-brand-primary) 35%, white) !important;
}

[data-brand-scope][data-brand-active='true'] .focus\:border-indigo-300:focus,
[data-brand-scope][data-brand-active='true'] .focus\:border-indigo-500:focus {
  border-color: var(--sp-brand-primary) !important;
}

[data-brand-scope][data-brand-active='true'] .border-blue-100,
[data-brand-scope][data-brand-active='true'] .border-blue-200,
[data-brand-scope][data-brand-active='true'] .hover\:border-blue-200:hover {
  border-color: var(--sp-brand-primary-border) !important;
}

[data-brand-scope][data-brand-active='true'] .ring-blue-100,
[data-brand-scope][data-brand-active='true'] .ring-blue-200 {
  --tw-ring-color: var(--sp-brand-primary-border) !important;
}

[data-brand-scope][data-brand-active='true'] .shadow-indigo-50,
[data-brand-scope][data-brand-active='true'] .shadow-indigo-50\/50,
[data-brand-scope][data-brand-active='true'] .shadow-indigo-100,
[data-brand-scope][data-brand-active='true'] .shadow-indigo-200 {
  --tw-shadow-color: color-mix(in srgb, var(--sp-brand-primary) 22%, transparent) !important;
}

[data-brand-scope][data-brand-active='true'] .hover\:shadow-indigo-50\/50:hover {
  --tw-shadow-color: color-mix(in srgb, var(--sp-brand-primary) 22%, transparent) !important;
}