/* V24.15 TARGETED FINAL: mobile chat composer bottom alignment only.
   Base: V24.15. No chat/data/Firebase/bot/upload/login logic changes.
   Scope: active mobile conversation only. */
@media (max-width: 768px){
  /* The existing V24.10 focus mode hides the bottom navigation and makes the
     chat surface full-screen. Keep that behavior and only make the flex
     column/composer boundary deterministic here. */
  .chat-main.mobile-active,
  #chatMainContainer.mobile-active,
  body.mobile-chat-focus .chat-main,
  body.mobile-chat-focus #chatMainContainer{
    top:0 !important;
    bottom:0 !important;
    height:100dvh !important;
    max-height:100dvh !important;
    min-height:0 !important;
    margin:0 !important;
    display:flex !important;
    flex-direction:column !important;
    box-sizing:border-box !important;
  }

  .chat-main.mobile-active .chat-window,
  body.mobile-chat-focus .chat-window{
    flex:1 1 auto !important;
    min-height:0 !important;
    height:auto !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }

  /* Do not reserve the old bottom-navigation/safe-area space after the
     navigation has been hidden. This is the actual fix for the blank strip
     below the message composer. */
  .chat-main.mobile-active .chat-input-zone,
  body.mobile-chat-focus .chat-input-zone{
    flex:0 0 auto !important;
    min-height:0 !important;
    height:auto !important;
    margin-top:auto !important;
    margin-bottom:0 !important;
    padding-bottom:0 !important;
    box-sizing:border-box !important;
  }

  /* Keep a compact visual breathing room, but never add a second iPhone
     safe-area block inside the composer. */
  .chat-main.mobile-active .zalo-input-area,
  body.mobile-chat-focus .zalo-input-area{
    padding-bottom:8px !important;
    margin-bottom:0 !important;
    box-sizing:border-box !important;
  }

  .chat-main.mobile-active .zalo-toolbar,
  body.mobile-chat-focus .zalo-toolbar{
    flex-shrink:0 !important;
  }
}

/* Standalone/PWA mode: preserve only the real home-indicator safe area.
   Normal browser mode remains flush to the viewport bottom. */
@media (max-width: 768px) and (display-mode: standalone){
  .chat-main.mobile-active .zalo-input-area,
  body.mobile-chat-focus .zalo-input-area{
    padding-bottom:max(8px, env(safe-area-inset-bottom, 0px)) !important;
  }
}