/* V24.10 TARGETED: Mobile chat focus mode
   Only affects the mobile chat screen while a conversation is open.
   Bottom navigation is hidden and the chat surface uses the full viewport,
   keeping the composer at the bottom like a native chat app.
*/
@media (max-width: 768px){
  /* When a chat is open, hide only the bottom app navigation. */
  body:has(#chatMainContainer.mobile-active) .sidebar-icon{
    display:none !important;
  }

  /* Let the active chat occupy the full mobile viewport. */
  body:has(#chatMainContainer.mobile-active) .chat-main,
  body:has(#chatMainContainer.mobile-active) #chatMainContainer{
    top:0 !important;
    bottom:0 !important;
    height:100dvh !important;
    max-height:100dvh !important;
    min-height:0 !important;
  }

  /* Keep the message list flexible and the composer pinned to the bottom. */
  body:has(#chatMainContainer.mobile-active) .chat-main{
    display:flex !important;
    flex-direction:column !important;
  }

  body:has(#chatMainContainer.mobile-active) .chat-window{
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }

  body:has(#chatMainContainer.mobile-active) .chat-input-zone{
    flex:0 0 auto !important;
    margin-top:auto !important;
    width:100% !important;
    padding-bottom:env(safe-area-inset-bottom) !important;
  }
}

/* Fallback for browsers where :has() is unavailable. */
@media (max-width: 768px){
  body.mobile-chat-focus .sidebar-icon{display:none !important;}
  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;
  }
  body.mobile-chat-focus .chat-main{display:flex !important;flex-direction:column !important;}
  body.mobile-chat-focus .chat-window{flex:1 1 auto !important;min-height:0 !important;overflow-y:auto !important;-webkit-overflow-scrolling:touch !important;}
  body.mobile-chat-focus .chat-input-zone{flex:0 0 auto !important;margin-top:auto !important;width:100% !important;padding-bottom:env(safe-area-inset-bottom) !important;}
}