@import url('/tokens.css');
.site-environment-indicator {
  display: flex;
  justify-content: center;
  padding: var(--sp-4) var(--sp-12);
  background: var(--c-bg-yellow);
  color: var(--c-navy);
  font-size: var(--fs-12);
  line-height: var(--lh-normal);
  border-block-end: 1px solid var(--c-yellow-border);
}
.site-environment-indicator[hidden] { display: none; }
.site-environment-indicator[data-site-environment="operations"] {
  display: block;
  padding: var(--sp-8) var(--sp-12);
  text-align: center;
  border-block-end: var(--sp-2) solid var(--c-yellow-border);
}
.site-environment-indicator strong {
  display: block;
  font-family: var(--font-heading);
  font-size: var(--fs-ui-heading);
  font-weight: 800;
}
.site-environment-indicator p {
  margin: var(--sp-4) 0 0;
  font-size: var(--fs-ui-body);
}