/* V38.23 — MOBILE CHAT / COMPOSER BOUNDARY LOCK — TARGETED ONLY
 *
 * Fixes the remaining iPhone issue where the composer is visually overlaid on
 * the message list and a drag beginning on the composer can move the page.
 * The chat window becomes physically bounded by the composer/keyboard edge.
 * No message, Firebase, send, camera, voice, menu, auth or PC/tablet logic.
 */
@media (max-width:767px){
  #chatMainContainer.mobile-active,
  body.mobile-chat-focus #chatMainContainer{
    position:fixed !important;
    inset:0 !important;
    width:100% !important;
    height:100vh !important;
    min-height:100vh !important;
    max-height:100vh !important;
    overflow:hidden !important;
    overscroll-behavior:none !important;
    touch-action:none !important;
  }

  /* The message viewport physically ends at the top of the composer.
     --v3823-keyboard-overlap is the part occupied by the native keyboard. */
  #chatMainContainer.mobile-active #chatWindow,
  body.mobile-chat-focus #chatWindow{
    flex:1 1 auto !important;
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;
    margin-bottom:calc(var(--v3823-composer-height,54px) + var(--v3823-keyboard-overlap,0px)) !important;
    padding-bottom:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior-y:contain !important;
    overscroll-behavior-x:none !important;
    touch-action:pan-y !important;
    overflow-anchor:none !important;
    scroll-padding-top:8px !important;
    scroll-padding-bottom:8px !important;
  }

  #chatMainContainer.mobile-active #chatWindow > *,
  body.mobile-chat-focus #chatWindow > *,
  #chatMainContainer.mobile-active #chatWindow .msg-row,
  body.mobile-chat-focus #chatWindow .msg-row{
    overflow-anchor:none !important;
  }

  /* Keyboard mode: composer is attached to the keyboard edge, not to a
     transient VisualViewport height. */
  #chatMainContainer.mobile-active .chat-input-zone.v3523-keyboard,
  body.mobile-chat-focus .chat-input-zone.v3523-keyboard{
    position:absolute !important;
    top:auto !important;
    bottom:var(--v3823-keyboard-overlap,0px) !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
    touch-action:none !important;
    overscroll-behavior:none !important;
    z-index:2200 !important;
  }

  /* Do not allow a touch that starts on the composer to become a chat scroll. */
  #chatMainContainer.mobile-active .chat-input-zone.v3523-keyboard,
  #chatMainContainer.mobile-active .chat-input-zone.v3523-keyboard *:not(#messageInput),
  body.mobile-chat-focus .chat-input-zone.v3523-keyboard,
  body.mobile-chat-focus .chat-input-zone.v3523-keyboard *:not(#messageInput){
    overscroll-behavior:none !important;
  }

  #chatMainContainer.mobile-active .chat-input-zone.v3523-keyboard #messageInput,
  body.mobile-chat-focus .chat-input-zone.v3523-keyboard #messageInput{
    touch-action:manipulation !important;
    overscroll-behavior:none !important;
    -webkit-user-select:text !important;
    user-select:text !important;
  }

  /* Attachment/emoji remain owned by the existing V35.23 composer state;
     this boundary simply reserves their actual rendered height. */
  #chatMainContainer.mobile-active .chat-input-zone.v3523-attachment,
  #chatMainContainer.mobile-active .chat-input-zone.v3523-emoji,
  body.mobile-chat-focus .chat-input-zone.v3523-attachment,
  body.mobile-chat-focus .chat-input-zone.v3523-emoji{
    touch-action:none !important;
    overscroll-behavior:none !important;
  }

  /* The old V38.19 88px content padding was a visual reserve for an overlay.
     V38.23 uses a real flex boundary instead, so remove that duplicate reserve. */
  #chatMainContainer.mobile-active #chatWindow,
  body.mobile-chat-focus #chatWindow{
    padding-bottom:0 !important;
  }

  /* Keep the page itself stable while iOS keyboard is open. */
  html.keyboard-open,
  html.keyboard-open body{
    height:100vh !important;
    min-height:100vh !important;
    max-height:100vh !important;
    overflow:hidden !important;
    overscroll-behavior:none !important;
  }

  html.keyboard-open body{
    position:fixed !important;
    inset:0 !important;
    bottom:0 !important;
  }
}