/*
  Page styles for the BIMS web app. They live in a file because the site's
  content policy allows no inline scripts; Flutter sets the body's own
  layout styles when it starts.
*/

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  /* The brand blue shows until the app's first frame, matching the
     manifest's splash colour. */
  background: #0a3d91;
}

/*
  Safe-area probe. CSS env() is the only way a page can read the iPhone's
  notch and home-indicator insets; bimsPwa.safeAreaInsets() reads them from
  this element's padding. It takes no space and is never seen.

  The insets are 0 until bimsPwa.coverSafeAreas() adds viewport-fit=cover;
  then the page reaches under the notch and the home bar. CSS cannot move
  the Flutter view out of them: Flutter sizes it from the viewport, not
  from its element, so the app has to pad its own content with
  safeAreaInsets() before it calls coverSafeAreas() (nothing calls it in
  v2.0.0, so iPhones keep the app inside the safe area). The page's own HTML (the noscript note and the boot
  failure page) keeps clear of them with the rules below.
*/
#bims-safe-area-probe {
  position: fixed;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  padding-top: env(safe-area-inset-top, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  padding-left: env(safe-area-inset-left, 0px);
  visibility: hidden;
  pointer-events: none;
}

/* The print helper's frame stays out of sight while the PDF prints. */
.bims-print-frame {
  position: fixed;
  right: 0;
  bottom: 0;
  width: 1px;
  height: 1px;
  border: 0;
  opacity: 0;
  pointer-events: none;
}

.bims-noscript {
  margin: 24px 16px;
  margin: max(24px, env(safe-area-inset-top, 0px))
    max(16px, env(safe-area-inset-right, 0px))
    max(24px, env(safe-area-inset-bottom, 0px))
    max(16px, env(safe-area-inset-left, 0px));
  color: #ffffff;
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif;
}

/*
  Boot failure page (bims_pwa.js): shown only when the app itself cannot
  load. System fonts, because the app's fonts may be what failed.
*/
.bims-boot-failure {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  /* Clear of the notch and the home bar once coverSafeAreas() is on. */
  padding: max(16px, env(safe-area-inset-top, 0px))
    max(16px, env(safe-area-inset-right, 0px))
    max(16px, env(safe-area-inset-bottom, 0px))
    max(16px, env(safe-area-inset-left, 0px));
  box-sizing: border-box;
  background: #0a3d91;
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif;
  color: #0f172a;
}

.bims-boot-card {
  width: 100%;
  max-width: 520px;
  box-sizing: border-box;
  padding: 28px;
  border-radius: 16px;
  background: #ffffff;
  text-align: center;
}

.bims-boot-card h1 {
  margin: 0 0 8px;
  font-size: 22px;
  line-height: 1.3;
}

.bims-boot-card p {
  margin: 0 0 16px;
  color: #475569;
}

.bims-boot-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}

.bims-boot-actions button {
  min-height: 44px;
  padding: 0 20px;
  border-radius: 10px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.bims-boot-primary {
  border: 0;
  background: #0a3d91;
  color: #ffffff;
}

.bims-boot-secondary {
  border: 1px solid #b8cce8;
  background: #ffffff;
  color: #0a3d91;
}