:root {
  /* Chemsa brand palette (from provided gradient) */
  --brand-start: #12007a;
  --brand-mid: #3f56cb;
  --brand-end: #6b92ef;

  --base-color: #3f56cb;
  --white: #ffffff;
  --black: #03061a;

  --dark-gray: #0f1638;
  --medium-gray: #4d5a88;
  --extra-medium-gray: #ccd5f2;
  --light-gray: #93a2d0;
  --very-light-gray: #eef2ff;
  --light-medium-gray: #e3e9ff;

  --charcoal-blue: #10183a;
  --slate-blue: #1a2555;
  --medium-slate-blue: #2b3d86;
  --extra-medium-slate-blue: #1a2555;
  --dark-slate-blue: #121b42;
  --extra-dark-slate-blue: #0b1130;
  --extra-very-slate-blue: #0d1434;

  /* Normalize non-brand accent colors to same blue family */
  --tussock-yellow: #5f7ee0;
  --golden-yellow: #6b92ef;
  --orange: #5878de;
  --cornflower-blue: #4e67d6;
  --majorelle-blue: #4a62d2;
  --light-majorelle-blue: #e9eeff;
  --selago: #edf1ff;
  --solitude-blue: #f3f6ff;
}

/* Project-wide blue gradient surfaces */
.bg-base-color,
.theme-light-bg,
.top-bar-dark.bg-dark-gray {
  background: linear-gradient(90deg, var(--brand-start) 0%, var(--brand-mid) 52%, var(--brand-end) 100%) !important;
}

/* Keep foreground contrast on gradient backgrounds */
.bg-base-color,
.theme-light-bg,
.top-bar-dark.bg-dark-gray,
.bg-base-color a,
.theme-light-bg a,
.top-bar-dark.bg-dark-gray a {
  color: #ffffff;
}

/* Base-color buttons inherit new palette */
.btn-base-color {
  background: linear-gradient(90deg, #2c3eb2 0%, var(--base-color) 55%, var(--brand-end) 100%) !important;
  border-color: #2c3eb2 !important;
  color: #ffffff !important;
}

.btn-base-color:hover,
.btn-base-color:focus {
  background: linear-gradient(90deg, #21349f 0%, #314bc5 55%, #5e86e7 100%) !important;
  border-color: #21349f !important;
  color: #ffffff !important;
}

.btn-base-color .btn-text,
.btn-base-color .btn-icon i,
.btn-base-color i {
  color: #ffffff !important;
}

/* White text/icons on branded gradient sections */
.bg-base-color .text-dark-gray,
.theme-light-bg .text-dark-gray,
.bg-base-color .text-dark-gray a,
.theme-light-bg .text-dark-gray a,
.bg-base-color .text-dark-gray i,
.theme-light-bg .text-dark-gray i,
.bg-base-color h1,
.bg-base-color h2,
.bg-base-color h3,
.bg-base-color h4,
.bg-base-color h5,
.bg-base-color h6,
.theme-light-bg h1,
.theme-light-bg h2,
.theme-light-bg h3,
.theme-light-bg h4,
.theme-light-bg h5,
.theme-light-bg h6,
.bg-base-color p,
.theme-light-bg p,
.bg-base-color span,
.theme-light-bg span,
.bg-base-color i,
.theme-light-bg i {
  color: #ffffff !important;
}