/* Contain the mobile application shell; wide widgets scroll inside their own viewport. */
@media (max-width:1024px) {
  html:has(.app-layout),html:has(.installer-portal),
  body:has(.app-layout),body:has(.installer-portal) {
    width:100%;max-width:100%;min-width:0;margin-inline:0;
    overflow-x:hidden;overscroll-behavior-x:none;
  }
  #root:has(.app-layout),#root:has(.installer-portal),
  .app-layout,.app-layout>.page-content,.installer-portal {
    box-sizing:border-box;min-width:0;max-width:100%;width:100%;
    overflow-x:clip;overscroll-behavior-x:none;
  }
  .app-layout>.page-content {margin-inline:0;}
  .flux-dashboard,.flux-dashboard>* {min-width:0;max-width:100%;box-sizing:border-box;}
  .flux-dashboard :is(.cc-browse,.cc-workspace,.cc-explorer-stage,.cc-filters,.cc-summary,.cc-suppliers) {min-width:0;max-width:100%;}
  .flux-dashboard .cc-filters {flex-wrap:wrap;}
  .flux-dashboard .cc-summary {flex-wrap:wrap;overflow-wrap:anywhere;}

  /* hidden creates a horizontal scroll container. clip cannot retain an x offset.
     Preserve the document's native vertical scrolling and fixed navigation. */
  @supports (overflow:clip) {
    html:has(.app-layout),html:has(.installer-portal),
    body:has(.app-layout),body:has(.installer-portal) {
      overflow-x:clip;
    }
    body:has(.app-layout),body:has(.installer-portal) {overflow-y:visible;}
  }
  html:has(.app-layout),html:has(.installer-portal),
  body:has(.app-layout),body:has(.installer-portal) {
    touch-action:pan-y pinch-zoom;
  }
  /* Native horizontal widgets retain their own pan axis; no bounce or chaining
     may move the document at either end. Do not change their vertical behavior. */
  :is(.app-layout,.installer-portal) :is(.fd-track,.recently-viewed-grid,.jw-columns,.pipeline-board,.ta-table-wrap,.an-table-wrap,.financials-scroll,.table-container,.table-wrapper),
  body:has(.app-layout) [data-fluxes-horizontal-scroll] {
    overscroll-behavior-x:none;
  }
}