/* Phone and tablet navigation: keep the existing role menu available while scrolling. */
@media (max-width: 900px) {
  body.bs-mobile-nav-active {
    padding-top: var(--bs-mobile-nav-height, 78px) !important;
  }
  body.bs-mobile-nav-active .portal-layout {
    padding-top: 0 !important;
  }
  .bs-mobile-nav-fixed {
    position: fixed !important;
    inset: 0 0 auto 0 !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    z-index: 2200 !important;
  }
  .admin-layout > .admin-sidebar.bs-mobile-nav-fixed {
    border-radius: 0 !important;
  }
  .client-portal-topbar.bs-mobile-nav-fixed,
  .track-head.bs-mobile-nav-fixed,
  .inquiry-top.bs-mobile-nav-fixed,
  .landing-header.bs-mobile-nav-fixed,
  .public-roof-header.bs-mobile-nav-fixed {
    background: #fff !important;
    border-bottom: 1px solid #e0e5eb !important;
    box-shadow: 0 4px 16px rgba(16, 24, 40, .10) !important;
    padding: 10px 14px !important;
  }
  .client-portal-topbar.bs-mobile-nav-fixed {
    border-radius: 0 !important;
    margin: 0 !important;
    gap: 8px !important;
  }
  .track-shell .track-head.bs-mobile-nav-fixed,
  .inquiry-shell .inquiry-top.bs-mobile-nav-fixed {
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    gap: 8px !important;
  }
  .track-head.bs-mobile-nav-fixed > *,
  .inquiry-top.bs-mobile-nav-fixed > * { min-width: 0; }
  .track-head.bs-mobile-nav-fixed .track-head-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
  }
  .track-head.bs-mobile-nav-fixed .track-head-actions .btn {
    padding: 9px 10px !important;
    font-size: .78rem !important;
  }

  /* Header labels stay in their own row, above the first chat bubble. */
  .track-shell .messenger-client-shell .messenger-client-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    position: relative !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 16px !important;
    gap: 12px !important;
    overflow: visible !important;
  }
  .track-shell .messenger-client-profile { min-width: 0 !important; }
  .track-shell .messenger-client-profile-copy { min-width: 0 !important; }
  .track-shell .messenger-client-shell .messenger-head-actions {
    position: static !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    gap: 8px !important;
  }
  .track-shell .messenger-head-ref,
  .track-shell .messenger-client-private {
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
  }
  .track-shell .messenger-client-shell .messenger-thread {
    position: relative !important;
    margin-top: 0 !important;
    padding-top: 18px !important;
  }
}

@media (max-width: 720px) {
  .landing-header.bs-mobile-nav-fixed .header-actions,
  .public-roof-header.bs-mobile-nav-fixed .public-roof-nav {
    flex-wrap: wrap !important;
  }
}