/* Chrome for the installable-PWA affordances driven by pwa.js: the connectivity
 * banner and the "add to home screen" button.
 *
 * Kept in its own file (rather than an inline <style> in index.html) to match
 * splash.css and keep style blocks out of the markup. Note that the CSP argument
 * that forces pwa.js to be external does NOT apply here: `style-src` in
 * vercel.json still allows 'unsafe-inline', because Flutter injects inline styles
 * at runtime and cannot work without it. Only `script-src` is locked down.
 *
 * Both elements start hidden and are only revealed by pwa.js, so a failure to
 * load this stylesheet cannot leave a stray banner covering the app.
 */
#pwa-offline-banner,
#pwa-install-button {
  position: fixed;
  z-index: 10000;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  display: none;
}

#pwa-offline-banner {
  left: 0;
  right: 0;
  top: 0;
  /* `viewport-fit=cover` in index.html lets content sit under the iOS notch, so
   * the banner has to pad itself out of it. */
  padding: 10px 16px;
  padding-top: calc(10px + env(safe-area-inset-top));
  background: #3a2f00;
  color: #ffe08a;
  text-align: center;
}

#pwa-install-button {
  right: 16px;
  bottom: calc(16px + env(safe-area-inset-bottom));
  padding: 12px 18px;
  border: none;
  border-radius: 999px;
  /* Brand green — the same seed color as the Flutter ColorScheme in app.dart. */
  background: #1baf57;
  color: #06210f;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}