/* Production only: the Worker links this file on the site's pages and in the app (GOL-99).
   A calm band that says the product is in beta and free until 1 January 2027. Staging has
   its own orange band instead (staging.css). */

:root { --beta-h: 32px; --beta: #edf2fd; --beta-lijn: #d6e0f7; }

.beta-band { background: var(--beta); color: #171a20; font-size: 0.8125rem; line-height: 1.3; }
.beta-band a { color: inherit; text-underline-offset: 3px; }

/* The site: a fixed band above the fixed header, one line wide, two on a narrow screen. */
.is-home .beta-band, .is-doc .beta-band {
  position: fixed; inset: 0 0 auto 0; z-index: 60;
  height: calc(var(--beta-h) + env(safe-area-inset-top, 0px));
  padding: env(safe-area-inset-top, 0px) 12px 0;
  display: flex; align-items: center; justify-content: center; gap: 12px;
  border-bottom: 1px solid var(--beta-lijn);
  white-space: nowrap; overflow: hidden;
}
.beta-band__kort { display: none; }
@media (max-width: 900px) {
  :root { --beta-h: 44px; }
  .is-home .beta-band, .is-doc .beta-band { flex-wrap: wrap; align-content: center; row-gap: 2px; }
  .beta-band__mail { flex-basis: 100%; text-align: center; }
}
@media (max-width: 560px) { .beta-band__lang { display: none; } .beta-band__kort { display: inline; } }

/* Everything that sat under the bar moves down by the band. */
.is-home .kop, .is-doc .kop { top: calc(var(--beta-h) + env(safe-area-inset-top, 0px)); height: var(--kop-h); padding-top: 0; }
.is-home .kop__vel, .is-doc .kop__vel { padding-top: calc(var(--beta-h) + var(--kop-h) + env(safe-area-inset-top, 0px) + 16px); }
.is-home .paneel { padding-top: calc(var(--beta-h) + var(--kop-h) + env(safe-area-inset-top, 0px) + clamp(16px, 5.5vh, 72px)); }
.is-doc .doc-hoofd { padding-top: calc(var(--beta-h) + var(--kop-h) + env(safe-area-inset-top, 0px) + clamp(40px, 8vh, 88px)); }
.is-home .skip:focus, .is-doc .skip:focus { top: calc(var(--beta-h) + 8px + env(safe-area-inset-top, 0px)); }

/* The app: in the flow above the layout. It folds shut to one line but never goes away. */
.beta-band--app { padding: 6px 16px; padding-top: calc(6px + env(safe-area-inset-top, 0px)); border-bottom: 1px solid var(--beta-lijn); }
.beta-band--app summary { cursor: pointer; font-weight: 500; }
.beta-band--app p { margin: 2px 0 0; }