/* Keep mobile settings in one scroll area and expose the existing logout action near the profile. */
@media (max-width: 760px) {
  html:root.native-mobile body #overlay.navigation-view[data-panel="settings"] {
    display: flex !important; flex-direction: column !important;
    height: calc(100dvh - 80px - env(safe-area-inset-bottom)) !important;
    bottom: calc(80px + env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
  }
  html:root.native-mobile body #overlay.navigation-view[data-panel="settings"] .panel {
    display: flex !important; flex-direction: column !important;
    height: 100% !important; min-height: 0 !important; overflow: hidden !important;
  }
  html:root.native-mobile body #overlay.navigation-view[data-panel="settings"] .panel > header { flex: 0 0 auto; }
  html:root.native-mobile body #overlay.navigation-view[data-panel="settings"] #panel-body {
    flex: 1 1 0 !important; min-height: 0 !important; height: auto !important;
    overflow-y: auto !important; overflow-x: hidden !important;
    padding-bottom: 24px !important; scroll-padding-bottom: 24px !important;
    -webkit-overflow-scrolling: touch;
  }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home:not(.hidden) {
    display: flex !important; flex-direction: column;
    height: auto !important; min-height: 0 !important; max-height: none !important;
    overflow: visible !important; padding-bottom: 16px !important;
  }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home > .settings-search { order: -3; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-home > .settings-profile-card { order: -2; margin-bottom: 16px; }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-log-out {
    order: -1; display: flex !important; visibility: visible !important; opacity: 1 !important;
    flex: 0 0 auto; width: 100%; min-height: 52px; margin: 0 0 24px;
    padding: 14px 16px; gap: 12px; border: 1px solid #e4b2b8; border-radius: 12px;
    background: #fff3f4; color: #b42332 !important; -webkit-text-fill-color: #b42332 !important;
    font-size: 16px; font-weight: 600; line-height: 1.4; text-align: left;
  }
  html:root.native-mobile[data-theme="dark"] body #overlay[data-panel="settings"] #settings-log-out {
    background: #301b20; border-color: #75414a; color: #ff9aa8 !important; -webkit-text-fill-color: #ff9aa8 !important;
  }
  html:root.native-mobile body #overlay[data-panel="settings"] #settings-log-out svg { width: 22px; height: 22px; flex: 0 0 22px; }
}