/* Admin · Status — only what is specific to this page. The shell, cards, pills, tables and tokens
   all come from /shared/admin.css. */

/* Live/paused pill in the header. */
.st-live-pill {
  display: flex; align-items: center; gap: 9px;
  background: #F7F9FC; border: 1px solid var(--adm-field); border-radius: 999px; padding: 8px 15px;
  font-family: "Lexend", sans-serif; font-weight: 600; font-size: 13px; color: #3B4757;
}

/* Overall verdict card beside the page title. */
.st-overall {
  display: flex; align-items: center; gap: 13px;
  background: #fff; border: 1px solid var(--adm-line); border-radius: 16px; padding: 14px 18px;
  box-shadow: 0 2px 10px rgba(18, 38, 63, 0.04);
}
.st-overall--ok { border-color: var(--adm-ok-bd); background: var(--adm-ok-bg); }
.st-overall--warn { border-color: var(--adm-warn-bd); background: var(--adm-warn-bg); }
.st-overall--bad { border-color: var(--adm-bad-bd); background: var(--adm-bad-bg); }
.st-overall-copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.st-overall-title { font-family: "Lexend", sans-serif; font-weight: 700; font-size: 15px; color: var(--adm-ink); }
.st-overall-note { font-size: 12.5px; color: var(--adm-muted); }

/* ------------------------------- Table tracks -------------------------------
   Budgeted against the real longest values these tables carry, not the design widths — the handoff
   warns that fixed floors summing past the content box pin every track at its floor and leave the
   `fr` units nothing to distribute. Measured here against the widest real content:
     Service   "Authenticated Scanning" + a full health URL  -> needs the flexible track
     Status    "Degraded"           ~86px
     Latency   "1234ms"             ~64px
     Uptime    "100%"               ~54px
     Checks    40 bars at 3px       ~130px flexible
     Version   "1.14.2"             ~62px
   Sum of floors 396px + gaps ~70px + padding 44px = ~510px inside a ~1370px card, leaving ~860px
   for the name column to absorb. */
.st-svc-table { --adm-cols: minmax(220px, 2.4fr) 86px 64px 54px minmax(110px, 1.2fr) 62px; }

/* Queue table: "reciteme.crawler.frontier" is the longest name; counts are 5 digits at most. */
.st-q-table { --adm-cols: minmax(200px, 2.4fr) 74px 74px 80px 68px minmax(96px, 1.1fr) 118px; }
.st-dlq-table { --adm-cols: minmax(200px, 3fr) 90px 90px 120px; }

.st-svc-name { display: flex; align-items: center; gap: 11px; min-width: 0; }
.st-svc-copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.st-latency { font-family: "Lexend", sans-serif; font-weight: 700; font-size: 13px; color: var(--adm-ink); }
.st-latency--slow { color: var(--adm-bad-fg); }
.st-latency--none { color: var(--adm-muted); font-weight: 600; }

/* Sparklines. Bars are 2-3px so they stay legible at 40 observations. */
.st-spark { display: flex; align-items: flex-end; gap: 2px; height: 26px; min-width: 0; }
.st-spark-bar { flex: 1; min-width: 2px; border-radius: 2px; }

.st-q-name { display: flex; align-items: center; gap: 11px; min-width: 0; }
.st-q-ready { font-family: "Lexend", sans-serif; font-weight: 800; font-size: 14px; color: var(--adm-ink); }
.st-q-ready--warn { color: var(--adm-warn-fg); }
.st-q-ready--bad { color: var(--adm-bad-fg); }
.st-zero { font-weight: 800; color: var(--adm-bad-fg); }
/* A backed-up row gets a wash as well as its pill, never instead of it. */
.st-row--alarm { background: #FEFAFA; }

.st-incident {
  display: grid; grid-template-columns: 84px minmax(0, 1fr) 90px; gap: 16px; align-items: start;
  padding: 16px 22px; border-bottom: 1px solid var(--adm-line-soft);
}
.st-incident:last-child { border-bottom: none; }
.st-incident-copy { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.st-incident-title { font-family: "Lexend", sans-serif; font-weight: 700; font-size: 14.5px; color: var(--adm-ink); }
.st-incident-detail { font-size: 13.5px; line-height: 1.55; color: var(--adm-muted); }

.st-broker { display: flex; gap: 34px; flex-wrap: wrap; align-items: center; }
.st-broker-item { display: flex; flex-direction: column; gap: 3px; }
.st-broker-label { font-family: "Lexend", sans-serif; font-weight: 700; font-size: 11.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--adm-muted); }
.st-broker-value { font-family: "Lexend", sans-serif; font-weight: 800; font-size: 19px; color: var(--adm-ink); }
.st-broker-error { font-size: 13px; color: var(--adm-bad-fg); }

@media (max-width: 1200px) {
  /* Drop the two widest optional columns before the name column starts truncating. */
  .st-svc-table { --adm-cols: minmax(180px, 2.4fr) 86px 64px 54px 62px; }
  .st-svc-table .adm-row > span:nth-child(5), .st-svc-table .adm-thead > span:nth-child(5) { display: none; }
  .st-q-table { --adm-cols: minmax(170px, 2.4fr) 74px 74px 80px 68px 118px; }
  .st-q-table .adm-row > span:nth-child(6), .st-q-table .adm-thead > span:nth-child(6) { display: none; }
}
@media (max-width: 900px) {
  .st-incident { grid-template-columns: minmax(0, 1fr); }
}