/*
 * Homepage custom CSS — minimal polish.
 * Auto-loaded from this file (no env-var toggle needed).
 * Homepage uses Tailwind under the hood. Inspect with browser devtools
 * to find more specific class names if you want to extend.
 */

/* Hover lift on service tiles */
[id^="services-"] .service:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.20);
  transition: transform 120ms ease, box-shadow 120ms ease;
}

/* Group header — thin accent under each title */
.services-group h2,
[id^="group-"] > div > h2 {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 0.25rem;
  margin-bottom: 0.5rem;
}

/* Active tab — bolder font weight */
.tab-button-active,
[class*="tabBarActive"] {
  font-weight: 600;
}

/* Vitals group: tighter padding so it reads as a status bar */
#group-vitals .service {
  padding: 0.5rem !important;
}

#group-vitals iframe {
  border-radius: 4px;
}

/* Embedded Grafana iframes — rounded corners, transparent background */
iframe[src*="/d-solo/"] {
  border-radius: 6px;
  background: transparent;
}