/* Site-wide environment banner. Loaded only when the banner is injected. */

:root {
  --ehs-env-banner-height: 64px;
}

.ehs-env-banner {
  position: sticky;
  top: 0;
  z-index: 10050;
  box-sizing: border-box;
  width: 100%;
  height: var(--ehs-env-banner-height);
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: stretch;
  grid-column: 1 / -1;
  text-align: center;
  font-family: "Space Grotesk", Inter, system-ui, sans-serif;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1;
  color: #1a1006;
  background: #f59e0b;
  border-bottom: 4px solid #b45309;
}

body:has(> .ehs-env-banner) .app-platform-layout {
  min-height: calc(100vh / var(--ui-zoom, 1) - var(--ehs-env-banner-height, 64px));
}

body:has(> .ehs-env-banner) .platform-sidebar-inner {
  top: 0;
  height: calc(100vh / var(--ui-zoom, 1) - var(--ehs-env-banner-height, 64px));
}