.service-status[hidden]{display:none!important}
.service-status{display:flex;align-items:center;gap:12px;padding:14px 18px;margin:8px 5px;border:2px solid var(--status-color);border-radius:6px;background:var(--status-bg);color:#183e3b}
.service-status-dot{flex:none;width:12px;height:12px;border-radius:3px;background:var(--status-color);align-self:flex-start;margin-top:5px}
.service-status-copy{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0;line-height:1.45;overflow-wrap:anywhere}
.service-status-copy strong{font-weight:700}
.service-status-copy [data-status-message]:empty{display:none}
.service-status .service-status-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;min-height:40px;padding:8px 14px;border:1px solid currentColor;border-radius:6px;color:#183e3b;background:rgba(255,255,255,.65);font-weight:600;text-decoration:none;white-space:nowrap}
.service-status .service-status-action:hover{background:#fff;text-decoration:none}
.service-status .service-status-action:focus-visible{outline:3px solid #183e3b;outline-offset:3px}
.service-status-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.service-status[data-color=green]{--status-color:#20a779;--status-bg:#e2f3eb}
.service-status[data-color=orange]{--status-color:#ee981a;--status-bg:#fff1da}
.service-status[data-color=red]{--status-color:#df4649;--status-bg:#fce8e8}
@media(max-width:600px){.service-status{flex-wrap:wrap}.service-status-copy{flex-basis:calc(100% - 24px)}.service-status .service-status-action{margin-left:24px}}

.service-status-start{font-size:12px;opacity:.85}.service-status-start[hidden]{display:none}

.service-status-heading{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.service-status [data-status-stage]{font-size:12px;font-weight:600;border:1px solid currentColor;border-radius:12px;padding:2px 8px}
.service-status [data-status-stage][hidden]{display:none}

.service-status-dismiss{flex:none;align-self:flex-start;border:0;background:transparent;color:#183e3b;font-size:26px;line-height:1;min-width:40px;min-height:40px;cursor:pointer;border-radius:4px}
.service-status-dismiss:hover{background:rgba(255,255,255,.7)}
.service-status-dismiss:focus-visible{outline:2px solid #183e3b;outline-offset:2px}
.service-status-dismiss[hidden],.service-status [data-status-end][hidden]{display:none!important}

/* Keep this shared component independent of legacy page typography/resets. */
.service-status,
.service-status .service-status-copy,
.service-status .service-status-heading,
.service-status [data-status-message],
.service-status .service-status-action,
.service-status .service-status-dismiss {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: 14px;
  font-style: normal;
  letter-spacing: normal;
  text-transform: none;
  line-height: 1.45;
}
.service-status, .service-status * { box-sizing: border-box; }
.service-status [data-status-label] { font-size:14px; font-weight:700 !important; }
.service-status [data-status-message] { font-weight:400 !important; }
.service-status .service-status-action,
.service-status .service-status-action [data-status-link] { font-weight:600 !important; font-size:14px; }
.service-status [data-status-stage] { font-family:inherit; font-size:12px; font-weight:600 !important; line-height:1.45; }
.service-status .service-status-start { font-family:inherit; font-size:12px; font-weight:400 !important; line-height:1.45; }
.service-status .service-status-dismiss { font-size:26px; font-weight:400 !important; line-height:1; padding:0; margin:0; box-shadow:none; }