/* Phone/tablet shell sizing. Keep horizontal movement inside intentional scrollers. */
@media (max-width: 1024px) {
  html:has(.app-layout), html:has(.installer-portal) {
    overflow-x: hidden;
    overscroll-behavior-x: none;
  }
  @supports (overflow: clip) {
    html:has(.app-layout), html:has(.installer-portal) { overflow-x: clip; }
  }
  body:has(.app-layout), body:has(.installer-portal),
  #root:has(.app-layout), #root:has(.installer-portal) {
    width: 100%; min-width: 0; max-width: 100%; margin-inline: 0;
  }
  .app-layout, .app-layout > .page-content, .installer-portal {
    box-sizing: border-box; width: 100%; min-width: 0; max-width: 100%;
  }
  .app-layout > .page-content { margin-left: 0; overflow-wrap: anywhere; }
  .page-content > *, .page-content :is(section, article, form, fieldset),
  .page-content :is(.fi-settings-shell, .fi-settings-content, .wq-settings-shell, .fg-settings-shell) {
    box-sizing: border-box; min-width: 0; max-width: 100%;
  }
  .app-layout > .topbar { box-sizing: border-box; left: 0; right: 0; width: auto; max-width: 100%; }
  .topbar-search, .topbar-search input { min-width: 0; }
  .page-content :is(.ta-table-wrap, .an-table-wrap, .financials-scroll, .table-container, .table-wrapper),
  .page-content :is(.jw-columns, .pipeline-board, .recently-viewed-grid, .fd-track) {
    min-width: 0; max-width: 100%; overscroll-behavior-x: contain;
  }
  .page-content :is(.ta-table-wrap, .an-table-wrap, .financials-scroll, .table-container, .table-wrapper) { overflow-x: auto; }
  .page-content :is(input, select, textarea) { box-sizing: border-box; min-width: 0; max-width: 100%; }
  .app-layout, .installer-portal, body:has(.app-layout) dialog { touch-action: manipulation; }
}
@media (max-width: 1024px) and (any-pointer: coarse) {
  /* iOS otherwise zooms the whole page when a small-text field receives focus. */
  body:has(.app-layout) :is(input:not([type=checkbox]):not([type=radio]), select, textarea),
  .installer-portal :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { font-size: 16px !important; }
}
@media (max-width: 767px) {
  .page-content :is(.page-header, .jw-header, .jw-header-actions, .cc-heading, .cc-heading-actions, .fi-heading, .financials-toolbar, .ft-toolbar, .an-heading) {
    flex-wrap: wrap; min-width: 0; max-width: 100%; gap: 10px;
  }
  .page-content :is(.page-header, .jw-header-actions, .cc-heading-actions, .financials-toolbar, .ft-toolbar) > * {
    min-width: 0; max-width: 100%;
  }
  .page-content :is(.page-header, .jw-header-actions, .cc-heading-actions) button { white-space: normal; }
}