/* Public System Status layout rhythm. Served as a same-origin stylesheet so CSP blocks no required styling. */
main.section { padding-top: 36px; padding-bottom: 32px; }
.status-page-head { margin-bottom: 18px !important; }
.status-layout { display: flex; flex-direction: column; row-gap: 16px; column-gap: 16px; gap: 16px; }
.status-current .card-head,
.status-components .card-head { flex-wrap: nowrap; align-items: flex-start; }
.status-current .card-head > :first-child,
.status-components .card-head > :first-child { min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; }
.status-current .card-head > .badge,
.status-components .card-head > .badge { flex: 0 0 auto; margin-left: auto; }
.status-components {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  column-gap: 16px;
  row-gap: 16px;
}
.status-components .card { min-height: 0; }
.status-components .card-head { margin-bottom: 10px; }
.status-components .card-title { overflow-wrap: anywhere; }
.status-components .muted.small { overflow-wrap: anywhere; }
.status-actions { margin-top: 0 !important; padding-top: 0; border-top: 0; }
@media (max-width: 700px) {
  main.section { padding-top: 28px; padding-bottom: 28px; }
  .status-page-head { margin-bottom: 16px !important; }
  .status-layout { row-gap: 16px; column-gap: 16px; gap: 16px; }
  .status-components {
    grid-template-columns: 1fr;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    row-gap: 16px !important;
    column-gap: 16px !important;
    gap: 16px !important;
  }
  .status-actions { margin-top: 0 !important; }
}
