/* ============================================================
   Shared "please wait" caption for model-driven views
   (Country Transition / Regional Pathways / Global Outlook).

   dcc.Loading (v2.10) hides its children (visibility:hidden) and overlays a
   spinner while a callback computes, so a message placed inside the children
   never shows during the run. Instead we attach the caption to the dot spinner
   itself, scoped per page via the dcc.Loading `parent_className`
   ("gg-loading-host" + an optional page class that overrides the text).
   ============================================================ */

/* Pin the dot spinner near the TOP of the (often tall) loading area instead of
   letting dcc.Loading center it vertically, so the user sees the dots + caption
   right below the "country coverage" line without scrolling. The spinner is
   positioned against the full-size loading overlay (its absolute parent). */
.gg-loading-host .dash-dot-spinner {
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
}

/* The caption shown beneath the bouncing dots while the model runs. */
.gg-loading-host .dash-dot-spinner::after {
  content: "Running the model — please wait…";
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  color: #1b3b5a;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.2px;
}

/* Per-page caption overrides. */
.gg-loading-region .dash-dot-spinner::after {
  content: "Running the model across the region — please wait…";
}
.gg-loading-map .dash-dot-spinner::after {
  content: "Building the global map — please wait…";
}
.gg-loading-trend .dash-dot-spinner::after {
  content: "Building the regional trend — please wait…";
}