/* The composer must occupy the same bottom slot before and after messages
 * arrive. Keep normal flex flow for keyboard, multiline text and emoji panels.
 */
#app .chat-shell > .raim-voice-emoji-composer,
#app .chat-shell > .chat-composer {
  flex: 0 0 auto;
  margin-top: auto;
}
/* Keep reading-state space; .chat-state.error remains visible. */
#app .chat-shell > .chat-state:not(.error) {
  flex: 1 1 0%;
  min-height: 0;
}
/* Initial permission/data waiting is not a confirmed read-only state.
 * Keep the field's normal appearance without changing its disabled property.
 * Confirmed read-only styling is untouched once the reading state is gone.
 */
#app .chat-shell > .chat-state:not(.error) ~ .raim-voice-emoji-composer .input-text:disabled {
  background-color: #fff;
  color: #172033;
}

/* Resolve a valid height on old mobile engines even before JS runs. */
#app .chat-shell {
  height: var(--raim-chat-viewport-height, 100vh);
  max-height: var(--raim-chat-viewport-height, 100vh);
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
@supports (height: 100dvh) {
  #app .chat-shell {
    height: var(--raim-chat-viewport-height, 100dvh);
    max-height: var(--raim-chat-viewport-height, 100dvh);
  }
}
/* Shared mobile input sizing avoids WebKit focus auto-zoom, without locking zoom. */
@media (max-width: 600px) {
  #app .auth-v4-field > input,
  #app .raim-voice-emoji-composer .input-text {
    font-size: 16px;
  }
}