/* =========================================================
   FlowSouq Seller OS — iPhone bottom-nav safe area fix
   ========================================================= */

@media (max-width: 768px){

  :root{
    --so-mobile-nav-height: 72px;
    --so-safe-bottom: env(safe-area-inset-bottom, 0px);
  }

  /*
   * Reserve enough room for:
   * - the fixed bottom nav
   * - the iPhone home-indicator safe area
   * - a little visual breathing room
   *
   * This fixes content/buttons being partially covered on iPhone.
   */
  .so-main{
    padding-bottom:
      calc(
        var(--so-mobile-nav-height)
        + var(--so-safe-bottom)
        + 28px
      ) !important;
  }

  .so-mobile-nav{
    min-height:
      calc(
        var(--so-mobile-nav-height)
        + var(--so-safe-bottom)
      );

    padding-bottom:
      max(
        8px,
        var(--so-safe-bottom)
      );
  }

  /*
   * Any page-level sticky action that sits above the nav
   * should clear both the nav and the iPhone safe area.
   */
  .sc-mobile-save,
  .sa-mobile-save{
    bottom:
      calc(
        var(--so-mobile-nav-height)
        + var(--so-safe-bottom)
        + 8px
      ) !important;
  }

  /*
   * Last content block should never sit flush against
   * the fixed bottom navigation.
   */
  .so-page{
    padding-bottom: 8px;
  }
}