
/* OWNER_SYSTEM_HEALTH_V1 */
#owner-system-health-v1-page {
  --sh-bg:#0c0711;
  --sh-card:#140b1d;
  --sh-border:rgba(255,255,255,.07);
  --sh-muted:#a99ab5;
  --sh-text:#f8f4fb;
  --sh-green:#36e18d;
  --sh-yellow:#ffc96b;
  --sh-red:#ff657e;
  --sh-blue:#71b7ff;
  color:var(--sh-text);
  margin-top:14px;
}

#owner-system-health-v1-page[hidden] { display:none !important; }
#owner-system-health-v1-page * { box-sizing:border-box; }

#owner-system-health-v1-page .sh-shell {
  padding:15px;
  border:1px solid var(--sh-border);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(31,17,43,.985),rgba(18,10,27,.985));
}

#owner-system-health-v1-page .sh-head,
#owner-system-health-v1-page .sh-card-head,
#owner-system-health-v1-page .sh-row-between {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}

#owner-system-health-v1-page h2,
#owner-system-health-v1-page h3 { margin:0; }
#owner-system-health-v1-page h2 { font-size:20px; }
#owner-system-health-v1-page h3 { font-size:14px; }

#owner-system-health-v1-page .sh-sub,
#owner-system-health-v1-page .sh-card-head p {
  margin:4px 0 0;
  color:var(--sh-muted);
  font-size:9px;
}

#owner-system-health-v1-page .sh-btn {
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  background:var(--sh-bg);
  color:#eee7f4;
  padding:9px 12px;
  font-size:9px;
  font-weight:950;
  cursor:pointer;
}

#owner-system-health-v1-page .sh-btn.primary {
  border-color:transparent;
  background:linear-gradient(90deg,#d61cf4,#9d31ed);
}

#owner-system-health-v1-page .sh-btn.red {
  color:#ff9cae;
  border-color:rgba(255,101,126,.25);
  background:rgba(255,101,126,.08);
}

#owner-system-health-v1-page .sh-statusbar {
  display:grid;
  grid-template-columns:1.2fr repeat(3,minmax(0,.6fr));
  gap:9px;
  margin:12px 0;
}

#owner-system-health-v1-page .sh-kpi,
#owner-system-health-v1-page .sh-card {
  border:1px solid rgba(255,255,255,.055);
  border-radius:15px;
  background:var(--sh-card);
}

#owner-system-health-v1-page .sh-kpi { padding:12px; }
#owner-system-health-v1-page .sh-kpi small {
  color:#97889f;
  font-size:7.8px;
  font-weight:950;
}
#owner-system-health-v1-page .sh-kpi b {
  display:block;
  margin-top:5px;
  font-size:18px;
}

#owner-system-health-v1-page .sh-kpi.normal b { color:var(--sh-green); }
#owner-system-health-v1-page .sh-kpi.warning b { color:var(--sh-yellow); }
#owner-system-health-v1-page .sh-kpi.critical b { color:var(--sh-red); }

#owner-system-health-v1-page .sh-card {
  padding:13px;
  margin-top:11px;
}

#owner-system-health-v1-page .sh-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

#owner-system-health-v1-page .sh-component-list,
#owner-system-health-v1-page .sh-alert-list,
#owner-system-health-v1-page .sh-api-list {
  display:grid;
  gap:7px;
  margin-top:9px;
}

#owner-system-health-v1-page .sh-item {
  display:grid;
  grid-template-columns:12px minmax(130px,1fr) minmax(180px,1.6fr) auto;
  gap:9px;
  align-items:center;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:11px;
  background:var(--sh-bg);
}

#owner-system-health-v1-page .sh-dot {
  width:9px;
  height:9px;
  border-radius:50%;
  box-shadow:0 0 12px currentColor;
}

#owner-system-health-v1-page .sh-dot.normal { color:var(--sh-green); background:var(--sh-green); }
#owner-system-health-v1-page .sh-dot.warning { color:var(--sh-yellow); background:var(--sh-yellow); }
#owner-system-health-v1-page .sh-dot.critical { color:var(--sh-red); background:var(--sh-red); }
#owner-system-health-v1-page .sh-dot.info { color:var(--sh-blue); background:var(--sh-blue); }

#owner-system-health-v1-page .sh-item b {
  font-size:9.5px;
}

#owner-system-health-v1-page .sh-item span {
  color:#ab9db5;
  font-size:8.5px;
}

#owner-system-health-v1-page .sh-pill {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 7px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  font-size:7.5px;
  font-weight:950;
  white-space:nowrap;
}

#owner-system-health-v1-page .sh-pill.normal {
  color:#94f0b7;
  border-color:rgba(54,225,141,.25);
}
#owner-system-health-v1-page .sh-pill.warning {
  color:#ffd78a;
  border-color:rgba(255,201,107,.25);
}
#owner-system-health-v1-page .sh-pill.critical {
  color:#ff9bad;
  border-color:rgba(255,101,126,.25);
}
#owner-system-health-v1-page .sh-pill.info {
  color:#9fcaff;
  border-color:rgba(113,183,255,.25);
}

#owner-system-health-v1-page .sh-alert {
  padding:10px;
  border-radius:11px;
  border:1px solid rgba(255,255,255,.05);
  background:var(--sh-bg);
}

#owner-system-health-v1-page .sh-alert.critical {
  border-color:rgba(255,101,126,.25);
}
#owner-system-health-v1-page .sh-alert.warning {
  border-color:rgba(255,201,107,.25);
}

#owner-system-health-v1-page .sh-alert b {
  display:block;
  font-size:9.5px;
}
#owner-system-health-v1-page .sh-alert span {
  display:block;
  margin-top:3px;
  color:var(--sh-muted);
  font-size:8px;
}

#owner-system-health-v1-page .sh-error-list {
  display:grid;
  gap:7px;
  margin-top:9px;
}

#owner-system-health-v1-page .sh-error {
  padding:9px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:10px;
  background:var(--sh-bg);
}

#owner-system-health-v1-page .sh-error b {
  display:block;
  font-size:8.8px;
}
#owner-system-health-v1-page .sh-error code {
  display:block;
  margin-top:4px;
  color:#b9abc3;
  font-size:7.7px;
  white-space:normal;
  word-break:break-word;
}

#owner-system-health-v1-page .sh-empty {
  padding:18px 10px;
  text-align:center;
  color:var(--sh-muted);
  font-size:9px;
}

#ownerSystemHealthNavButton.active,
#ownerSystemHealthNavButton.sh-active {
  color:#fff !important;
  border-color:transparent !important;
  background:linear-gradient(90deg,#d61cf4,#9d31ed) !important;
  box-shadow:0 8px 24px rgba(214,28,244,.18) !important;
}

@media(max-width:900px) {
  #owner-system-health-v1-page .sh-grid { grid-template-columns:1fr; }
  #owner-system-health-v1-page .sh-statusbar { grid-template-columns:1fr 1fr; }
}

@media(max-width:620px) {
  #owner-system-health-v1-page .sh-shell { padding:11px; }
  #owner-system-health-v1-page .sh-head,
  #owner-system-health-v1-page .sh-card-head { display:block; }
  #owner-system-health-v1-page .sh-item {
    grid-template-columns:12px 1fr auto;
  }
  #owner-system-health-v1-page .sh-item > span {
    grid-column:2 / -1;
  }
}
