:root {
  --colombino-purple: #9370d8;
  --colombino-purple-light: #d29cff;
  --colombino-blue: #99ddff;
  --colombino-muted: #bdc3c7;
  --colombino-bg: #0e0b14;
  --colombino-surface: #16121f;
}

body,
#global {
  background-color: var(--colombino-bg) !important;
}

header img {
  border-radius: 12px;
}

.dashboard-heading,
h2.text-3xl {
  background: linear-gradient(90deg, var(--colombino-purple), var(--colombino-purple-light));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}

.dashboard-subheading,
.text-gray-400 {
  color: var(--colombino-muted) !important;
}

.endpoint,
[class*="endpoint"] {
  border-color: rgba(147, 112, 216, 0.2) !important;
}

.group-header,
h3.text-xl {
  color: var(--colombino-blue) !important;
  letter-spacing: 0.02em;
}

a.button,
.ui-button {
  border-color: rgba(153, 221, 255, 0.4) !important;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

a.button:hover,
.ui-button:hover {
  border-color: var(--colombino-blue) !important;
  background-color: rgba(153, 221, 255, 0.08) !important;
}