/* ============================================================
   APM Siaga — mobile bottom navigation refinements
   Loaded after style.min.css (see _head.tpl).
   Tweaks only the native .footer-bottom-bar so longer labels
   ("Org Profile", "Marketplace", "MyKonnect") fit the 70px bar.
   ============================================================ */

/* Let wrapped 2-word labels fit inside the fixed 70px bar */
.apm-bottom-nav .footer-bottom-bar-links .link > a > .title {
  font-size: 11px;
  line-height: 1.2;
  margin-top: 1px;
}

/* Slightly tighter icon/title stack so 2-line labels don't overflow */
.apm-bottom-nav .footer-bottom-bar-links > .link > a {
  padding: 7px 4px;
}

/* Respect iOS home-indicator / notch safe area */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .apm-bottom-nav {
    height: calc(70px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
  }
}

/* ------------------------------------------------------------
   FIX: the bar is position:fixed (out of flow), so page content
   scrolls underneath it and the last ~70px gets hidden behind it.
   Reserve matching space at the bottom of the document so the last
   content always sits ABOVE the bar. Mobile only (bar hidden >=768px).
   Height matches the bar incl. the iOS safe area.
   ------------------------------------------------------------ */
@media (max-width: 767px) {
  body {
    padding-bottom: 70px;
  }
  @supports (padding-bottom: env(safe-area-inset-bottom)) {
    body {
      padding-bottom: calc(70px + env(safe-area-inset-bottom));
    }
  }
}
