/* Mobile editor only. Keep native Flarum submission, drafts and modal behavior. */
@media (max-width:767px) {
  /* The native class is lowercase and is appended directly to body. */
  body.tm-mobile-v3.tm-mobile-v3-composer-open > .composer-backdrop {
    display:none !important;
    pointer-events:none !important;
  }
  body.tm-mobile-v3.tm-mobile-v3-composer-open .w95-taskbar,
  body.tm-mobile-v3.tm-mobile-v3-composer-open .tm-mobile-v3-nav { display:none !important; }

  body.tm-mobile-v3 .Composer.visible:not(.minimized),
  body.tm-mobile-v3.tm-mobile-v3-keyboard-open .Composer.visible:not(.minimized) {
    top:var(--tm-mobile-view-top,0px) !important;
    left:var(--tm-mobile-view-left,0px) !important;
    right:auto !important;
    bottom:auto !important;
    width:var(--tm-mobile-view-width,100vw) !important;
    height:var(--tm-mobile-view-height,100dvh) !important;
    max-width:none !important;
    max-height:none !important;
    box-sizing:border-box !important;
    border-width:2px !important;
    box-shadow:none !important;
    padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px) !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) > .win95-composer-titlebar {
    height:46px !important;
    min-height:46px !important;
    flex:0 0 46px !important;
    padding:0 94px 0 8px !important;
    margin:2px !important;
    width:calc(100% - 4px) !important;
    box-sizing:border-box !important;
  }
  /* Flarum's fixed white mobile header otherwise paints over our titlebar. */
  body.tm-mobile-v3 .Composer.visible:not(.minimized)::before { display:none !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .win95-composer-title-left {
    display:flex !important; align-items:center !important; min-width:0 !important; overflow:hidden !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .win95-composer-title-left > :last-child {
    overflow:hidden !important; white-space:nowrap !important; text-overflow:ellipsis !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) > .win95-composer-menubar,
  body.tm-mobile-v3 .Composer.visible:not(.minimized) > .win95-composer-statusbar,
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .Composer-handle { display:none !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) > .Composer-controls {
    display:flex !important; align-items:center !important; gap:2px !important;
    top:calc(env(safe-area-inset-top,0px) + 3px) !important; right:calc(env(safe-area-inset-right,0px) + 3px) !important;
    left:auto !important; width:auto !important; margin:0 !important; padding:0 !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .Composer-controls > li,
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .Composer-controls .App-backControl {
    display:block !important; position:static !important; float:none !important;
    width:auto !important; height:auto !important; margin:0 !important; padding:0 !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .Composer-controls > .item-fullScreen { display:none !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .Composer-controls .Button {
    position:static !important; display:flex !important; align-items:center !important; justify-content:center !important;
    width:44px !important; height:44px !important; min-height:44px !important; padding:0 !important; margin:0 !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .Composer-controls .Button-icon { font-size:18px !important; margin:0 !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .Composer-controls .item-minimize .Button-icon::before { content:'\f068' !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) > .Composer-content { padding:0 !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .ComposerBody { padding:0 6px 6px !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .ComposerBody-header {
    padding:2px 0 !important; max-height:84px !important; overflow:auto !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .ComposerBody--discussion .ComposerBody-header > .item-title { display:none !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .ComposerBody-header > li {
    position:static !important; display:block !important; height:auto !important;
    min-height:0 !important; margin:0 !important; padding:2px 0 !important;
    white-space:normal !important; border:0 !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .ComposerBody-header h3 { margin:0 !important; line-height:1.4 !important; font-size:14px !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .ComposerBody-header input {
    font-size:16px !important; min-height:40px !important; height:auto !important; padding:6px !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-editorContainer,
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .ComposerBody-mentionsWrapper,
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .ComposerBody-emojiWrapper {
    display:flex !important; flex-direction:column !important; flex:1 1 auto !important;
    min-height:0 !important; min-width:0 !important; width:100% !important; height:auto !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) textarea.TextEditor-editor {
    flex:1 1 auto !important; height:auto !important; min-height:48px !important;
    padding:10px !important; font-size:16px !important; line-height:1.5 !important;
    box-sizing:border-box !important; -webkit-overflow-scrolling:touch;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-controls {
    display:flex !important; flex-wrap:wrap !important; gap:4px !important;
    flex:0 0 auto !important; overflow:visible !important; width:100% !important;
    margin:4px 0 0 !important; padding:0 !important; min-height:44px !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-controls > li {
    margin:0 !important; padding:0 !important; flex:0 0 auto !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-controls .item-submit,
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-controls .App-primaryControl {
    position:static !important; top:auto !important; right:auto !important; left:auto !important;
    width:auto !important; height:auto !important; margin:0 !important; float:none !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-controls .Button {
    min-width:44px !important; min-height:44px !important; height:44px !important;
    padding:8px !important; font-size:15px !important; touch-action:manipulation;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-controls .item-submit .Button {
    display:inline-flex !important; align-items:center !important; gap:6px !important;
    width:auto !important; min-width:86px !important; padding:8px 14px !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .item-submit .Button-label { display:inline !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .item-submit .Button-icon { margin:0 !important; }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-controls > .TextEditor-toolbar {
    display:flex !important; flex:0 0 100% !important; align-items:center !important;
    min-width:0 !important; width:100% !important; max-width:100% !important;
    overflow-x:auto !important; overflow-y:hidden !important; white-space:nowrap !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-toolbar .MarkdownToolbar {
    display:flex !important; flex:0 0 auto !important; float:none !important;
  }
  body.tm-mobile-v3 .Composer.visible:not(.minimized) .TextEditor-toolbar .Button { flex:0 0 auto !important; }
}
