@media (max-width: 899.95px) {
  body.fx-mobile-inbox,
  html.fx-mobile-inbox-root {
    overflow: hidden !important;
  }

  .iw-chat-thread,
  .zz-iw-chat-thread {
    position: fixed !important;
    top: var(--fx-mobile-inbox-top, 0px) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    width: 100vw !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    z-index: 1450 !important;
    border-radius: 0 !important;
    background: #f7f9fb !important;
  }

  .iw-chat-thread > div:first-child,
  .zz-iw-chat-thread > div:first-child {
    order: 1 !important;
    flex: 0 0 auto !important;
    z-index: 3 !important;
    background: #fff !important;
  }

  .iw-chat-thread > div:nth-child(2),
  .zz-iw-chat-thread > div:nth-child(2) {
    order: 2 !important;
    flex: 1 1 0 !important;
    min-height: 0 !important;
    height: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .iw-chat-thread > div:last-child,
  .zz-iw-chat-thread > div:last-child {
    order: 3 !important;
    flex: 0 0 auto !important;
    position: relative !important;
    bottom: auto !important;
    margin-top: 0 !important;
    z-index: 4 !important;
    background: #fff !important;
    border-top: 1px solid rgba(15,23,42,.08) !important;
    box-shadow: 0 -8px 22px rgba(15,23,42,.08) !important;
  }

  .iw-chat-thread textarea,
  .iw-chat-thread input,
  .zz-iw-chat-thread textarea,
  .zz-iw-chat-thread input {
    font-size: 16px !important;
  }

  .fx-mobile-nav {
    z-index: 1600 !important;
  }
}

/* ===== Compact mobile Type/Reply composer alignment ===== */
@media (max-width: 899.95px) {
  .zz-iw-chat-thread > div:last-child,
  .iw-chat-thread > div:last-child {
    min-height: 54px !important;
    padding: 0 !important;
  }

  .zz-iw-chat-thread .zz-iw-composer-row,
  .iw-chat-thread .zz-iw-composer-row {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 54px !important;
    max-height: 62px !important;

    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 3px !important;
    padding: 6px 6px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  .zz-iw-chat-thread .zz-iw-composer-field,
  .iw-chat-thread .zz-iw-composer-field {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 3px !important;
  }

  .zz-iw-chat-thread .zz-iw-composer-field .MuiInputBase-root,
  .iw-chat-thread .zz-iw-composer-field .MuiInputBase-root {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    max-height: 46px !important;

    border-radius: 22px !important;
    padding: 4px 12px !important;
    margin: 0 !important;
    background: #f3f5f8 !important;
    box-sizing: border-box !important;
  }

  .zz-iw-chat-thread .zz-iw-composer-field input,
  .zz-iw-chat-thread .zz-iw-composer-field textarea,
  .iw-chat-thread .zz-iw-composer-field input,
  .iw-chat-thread .zz-iw-composer-field textarea {
    width: 100% !important;
    min-width: 0 !important;
    height: 24px !important;
    max-height: 28px !important;

    padding: 0 !important;
    margin: 0 !important;
    font-size: 16px !important;
    line-height: 24px !important;
    text-align: left !important;
  }

  .zz-iw-chat-thread .zz-iw-composer-action,
  .iw-chat-thread .zz-iw-composer-action,
  .zz-iw-chat-thread .zz-iw-composer-row > button,
  .zz-iw-chat-thread .zz-iw-composer-row > [role="button"],
  .iw-chat-thread .zz-iw-composer-row > button,
  .iw-chat-thread .zz-iw-composer-row > [role="button"] {
    flex: 0 0 34px !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;

    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;

    padding: 5px !important;
    margin: 0 !important;

    display: inline-grid !important;
    place-items: center !important;
    border-radius: 50% !important;
  }

  .zz-iw-chat-thread .zz-iw-composer-action svg,
  .iw-chat-thread .zz-iw-composer-action svg,
  .zz-iw-chat-thread .zz-iw-composer-row button svg,
  .iw-chat-thread .zz-iw-composer-row button svg {
    width: 21px !important;
    height: 21px !important;
  }
}

@media (max-width: 379.95px) {
  .zz-iw-chat-thread .zz-iw-composer-row,
  .iw-chat-thread .zz-iw-composer-row {
    gap: 2px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
  }

  .zz-iw-chat-thread .zz-iw-composer-action,
  .iw-chat-thread .zz-iw-composer-action,
  .zz-iw-chat-thread .zz-iw-composer-row > button,
  .iw-chat-thread .zz-iw-composer-row > button {
    flex-basis: 32px !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
  }

  .zz-iw-chat-thread .zz-iw-composer-field,
  .iw-chat-thread .zz-iw-composer-field {
    margin-left: 2px !important;
    margin-right: 2px !important;
  }
}