:root {
  --color-amber-500: #7c5cff;
  --color-amber-400: #9b86f5;
  --color-amber-300: #b8aaf7;
  --color-blue-500: #7c5cff;
}

/* Overall page */
body {
  background: #171522 !important;
}

/* Main content */
#page_container {
  background: #171522 !important;
}

/* Search area */
.search {
  background: #211d2d !important;
  border: 1px solid #342d49 !important;
}

/* Section headings */
.services-group > h2 {
  color: #b8aaf7 !important;
}

/* Service cards */
.service-card {
  background: #211d2d !important;
  border: 1px solid #302943 !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18) !important;
}

/* Card icons */
.service-card .service-icon {
  color: #9b86f5 !important;
}

/* Card titles */
.service-card .service-name {
  color: #e4e0ef !important;
}

/* Card descriptions */
.service-card .service-description {
  color: #9e99ad !important;
}

/* Monitoring graphs */
.service-card svg path {
  stroke: #7c5cff;
}

/* Resource/stat boxes */
.service-card .stat {
  background: #1b1826 !important;
}

/* Search input */
input[type="text"] {
  color: #e4e0ef !important;
}

/* Links */
a {
  transition: opacity 0.2s ease, transform 0.2s ease;
}

a:hover {
  opacity: 0.9;
}

/* Keep health indicators visually distinct */
.text-green-500,
.text-green-400 {
  color: #4ade80 !important;
}