/* Public status / data-freshness page (gap G4 — trust made visible). */
.status-banner {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border-radius: var(--r-md);
  border: 1px solid var(--ink-200);
  margin-bottom: var(--sp-5);
}
.status-banner--operational { background: rgba(22, 163, 74, 0.08); border-color: rgba(22, 163, 74, 0.3); }
.status-banner--delayed     { background: rgba(234, 179, 8, 0.10); border-color: rgba(234, 179, 8, 0.35); }
.status-banner--unknown     { background: var(--ink-100); }

.status-dot {
  width: 12px; height: 12px; border-radius: 50%;
  flex: 0 0 auto; background: var(--ink-400, #9CA3AF);
}
.status-banner--operational .status-dot { background: var(--success, #16A34A); box-shadow: 0 0 0 4px rgba(22,163,74,0.18); }
.status-banner--delayed .status-dot     { background: #CA8A04; box-shadow: 0 0 0 4px rgba(234,179,8,0.18); }
.status-dot--ok   { background: var(--success, #16A34A); }
.status-dot--warn { background: #CA8A04; }

.status-grid {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  margin: var(--sp-3) 0;
}
.status-row {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--ink-200);
  border-radius: var(--r-md);
  background: var(--paper);
}
.status-row-main { flex: 1; min-width: 0; }
.status-row-label { font-weight: 600; color: var(--ink-900); }
.status-row-when { text-align: right; flex: 0 0 auto; }
.status-when-value { font-weight: 700; color: var(--ink-900); white-space: nowrap; }
.status-note { margin-top: var(--sp-2); }