/* ==========================================================
   Mediajaw - Facebook in-app browser fixes
   Load on every page, before the site's own stylesheet:
   <link rel="stylesheet" href="assets/fb-fix.css">
   Only safe, layout-neutral rules are global; the rest are
   opt-in classes so existing sites don't shift on an edit.
   ========================================================== */

/* 1. Stop Facebook / mobile browsers from inflating text */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* 2. Long words (emails, URLs, big headings) wrap instead of overflowing */
h1, h2, h3, h4, h5, h6, p, li, td, dd {
  overflow-wrap: break-word;
}

/* ---------- Opt-in helpers ---------- */

/* Full-screen hero / mobile menu that isn't hidden under Facebook's toolbar.
   vh first as the fallback for old Android WebViews. */
.mj-fullh {
  min-height: 100vh;
  min-height: 100dvh;
}

/* Fixed bottom bars / sticky buttons clear the iPhone home bar.
   (Needs viewport-fit=cover in the viewport meta to take effect.) */
.mj-safe-bottom {
  padding-bottom: max(12px, env(safe-area-inset-bottom));
}

/* Buttons and nav links grow with enlarged text instead of clipping */
.mj-grow {
  height: auto !important;
  min-height: 44px;
  white-space: normal;
  line-height: 1.25;
}

/* fb.js adds .is-fb / .is-fb-android / .is-fb-ios to <html>,
   so a site can patch anything that only breaks inside Facebook:
   .is-fb .hero { min-height: 100vh; }                              */
