/* ===== Hermes Dashboard - Aggressive Glass Override ===== */

/* Kill the bg brightness/saturate filters Homepage applies to bg */
.backdrop-brightness-60,
.backdrop-saturate-130 {
  --tw-brightness: 1 !important;
  --tw-saturate: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* === SERVICE CARDS - force glass over every Tailwind bg utility === */
.service-card,
.dark .service-card,
[class~="bg-theme-100/20"],
.dark [class~="bg-white/5"] {
  background: rgba(20, 25, 40, 0.55) !important;
  backdrop-filter: blur(28px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4),
              inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  padding: 14px 16px !important;
  transition: all 0.2s ease !important;
  color: #f0f4f8 !important;
}

.service-card:hover,
.dark .service-card:hover {
  background: rgba(30, 40, 60, 0.65) !important;
  border-color: rgba(255, 255, 255, 0.30) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.55),
              inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  transform: translateY(-2px);
}

/* === TEXT === */
.service-name,
.dark .service-name {
  color: #f0f4f8 !important;
  font-weight: 500 !important;
}
.service-description,
.dark .service-description {
  color: #b8c4d4 !important;
  font-size: 11px !important;
  opacity: 0.9;
}

/* === ICONS === */
.service-icon {
  opacity: 0.95;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.5));
}
.service-icon svg { width: 26px !important; height: 26px !important; }

/* === PING BADGE === */
.ping-status,
.dark .ping-status {
  background: rgba(16, 185, 129, 0.22) !important;
  border: 1px solid rgba(16, 185, 129, 0.40) !important;
  color: #6ee7b7 !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border-radius: 4px !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.05em !important;
  padding: 2px 6px !important;
  text-transform: uppercase !important;
}

/* === GROUP HEADERS === */
.service-group-name,
.dark .service-group-name {
  color: #d4b3ff !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  background: rgba(10, 15, 25, 0.45) !important;
  backdrop-filter: blur(16px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  border-radius: 10px !important;
  padding: 8px 14px !important;
  margin-bottom: 8px !important;
}

/* === WIDGETS (top status bar) === */
.widget-container,
.dark .widget-container {
  background: rgba(20, 25, 40, 0.55) !important;
  backdrop-filter: blur(28px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4) !important;
  padding: 12px 16px !important;
  color: #f0f4f8 !important;
}

/* === SERVICES GROUP PADDING === */
.services-group { padding: 8px !important; }
.services-list { gap: 8px !important; }

/* === BODY transparent === */
body, html, #__next { background: transparent !important; }