/* Touch + laptop/tablet/phone layout adjustments site-wide. */

:root {
  --os-touch-target-min: 44px;
  --os-touch-control-height: 2.75rem;
  --os-touch-grid-row-height: 35px;
  --os-touch-grid-header-height: 32px;
  --os-ui-scale: 1;
  --os-page-gutter-inline: max(0.75rem, env(safe-area-inset-left, 0px));
  --os-page-gutter-inline-end: max(0.75rem, env(safe-area-inset-right, 0px));
}

/* Safe-area padding for notched phones and tablets. */
.os-app-header .os-app-navbar-inner,
.os-module-toolbar .container-fluid,
.os-module-toolbar .os-page-gutter,
.os-page-gutter,
.os-app-footer .container-fluid {
  padding-left: var(--os-page-gutter-inline);
  padding-right: var(--os-page-gutter-inline-end);
}

body.os-app-shell {
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

/* Firefox / browsers without zoom: scale the root rem size and grid tokens. */
html.os-ui-zoom-fallback {
  font-size: calc(14px * var(--os-ui-scale));
}

@media (min-width: 768px) {
  html.os-ui-zoom-fallback {
    font-size: calc(16px * var(--os-ui-scale));
  }
}

html.os-ui-zoom-fallback {
  --os-grid-cell-font-size: calc(11px * var(--os-ui-scale));
  --os-grid-header-font-size: calc(10px * var(--os-ui-scale));
  --os-table-cell-font-size: calc(0.74rem * var(--os-ui-scale));
  --os-app-header-height: calc(56px * var(--os-ui-scale));
  --os-app-footer-height: calc(2rem * var(--os-ui-scale));
}

/* App pages keep document scrolling; login pages lock to one screen (landscape app shell). */
@media (orientation: landscape) {
  html.os-ui-scaled:has(body.os-app-shell:not(.login-shell)) {
    height: 100%;
    overflow: hidden;
  }
}

html:has(body.login-shell) {
  height: 100%;
  max-height: 100%;
  overflow: hidden;
}

body.login-shell {
  overflow-x: clip;
  overflow-y: hidden;
  height: 100dvh;
  max-height: 100dvh;
}

body.login-shell.login-shell-scrollable,
body.login-shell:has(.login-marketing-shell) {
  overflow: hidden;
  height: 100dvh;
  max-height: 100dvh;
  min-height: 100dvh;
}

html:has(body.login-shell.login-shell-scrollable),
html:has(body.login-shell:has(.login-marketing-shell)) {
  height: 100%;
  max-height: 100%;
  overflow: hidden;
}

body.login-shell > .login-branded-layout {
  flex: 0 1 auto;
  min-height: 0;
  overflow-x: clip;
  overflow-y: visible;
  padding-bottom: 0;
  justify-content: center;
}

body.login-shell:has(.login-cert-footer) {
  justify-content: flex-start;
}

body.login-shell:has(.login-cert-footer) > .login-branded-layout {
  flex: 1 1 auto;
  min-height: 0;
  justify-content: center;
  align-self: center;
}

body.login-shell:not(:has(.login-cert-footer)) {
  justify-content: center;
}

body.login-shell:not(:has(.login-cert-footer)) > .login-branded-layout {
  flex: 0 1 auto;
  max-height: calc(100dvh - 24px);
  overflow-y: auto;
}

body.login-shell.login-shell-scrollable > .login-branded-layout,
body.login-shell:has(.login-marketing-shell) > .login-branded-layout {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  justify-content: flex-start;
  padding-top: clamp(0.25rem, 2vh, 1.25rem);
  padding-bottom: 1rem;
}

.login-branded-layout:has(.login-marketing-shell) .login-page-center {
  overflow: visible;
  min-height: min-content;
  flex: 0 0 auto;
}

body.login-shell > .login-cert-footer {
  flex: 0 0 auto;
  width: 100%;
}

body.os-ui-scaled.login-shell {
  width: 100%;
}

/* App pages scroll vertically and horizontally when content overflows. */
body.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main {
  overflow: auto;
  overflow-x: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

@media (orientation: landscape) {
  body.os-app-body:has(.module-main-page) {
    height: 100dvh;
    max-height: 100dvh;
  }
}

body.os-app-body:has(.module-main-page) > .container-fluid > .os-app-main,
body.os-app-body:has(.module-main-page) .module-main-page > .module-main-layout {
  overflow: auto;
  overflow-x: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  max-height: 100%;
}

.module-main-group-nav,
.module-main-group-panels,
.prs-group-nav,
.prs-group-panels,
.os-page-scroll,
.os-page-table-view {
  -webkit-overflow-scrolling: touch;
}

/* Coarse pointer / touch layout class set by touch-responsive.js */
body.os-touch-layout {
  --os-toolbar-control-height: var(--os-touch-control-height);
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(31, 75, 153, 0.12);
}

body.os-touch-layout .form-control,
body.os-touch-layout .form-select,
body.os-touch-layout .btn:not(.btn-link):not(.nav-link),
body.os-touch-layout .dropdown-toggle,
body.os-touch-layout .dx-texteditor-input {
  min-height: var(--os-touch-target-min);
}

/* Compact chrome controls — tall touch targets stack and crush content after rotate. */
body.os-touch-layout .os-module-toolbar .form-select,
body.os-touch-layout .os-module-toolbar .module-main-filter-select,
body.os-touch-layout .os-module-toolbar .prs-station-select,
body.os-touch-layout .os-page-toolbar .form-control,
body.os-touch-layout .os-page-toolbar .form-select,
body.os-touch-layout .os-page-toolbar .btn:not(.btn-link),
body.os-touch-layout .os-page-toolbar .dropdown-toggle,
body.os-touch-layout .os-page-sticky-chrome .form-control,
body.os-touch-layout .os-page-sticky-chrome .form-select,
body.os-touch-layout .os-page-sticky-chrome .btn:not(.btn-link),
body.os-touch-layout .os-desktop-page-header .form-control,
body.os-touch-layout .os-desktop-page-header .form-select,
body.os-touch-layout .os-desktop-page-header .btn:not(.btn-link),
body.os-touch-layout .plan-toolbar .btn:not(.btn-link),
body.os-touch-layout .rotation-toolbar .btn:not(.btn-link) {
  min-height: 0;
  height: var(--os-toolbar-control-height, 1.65rem);
  max-height: var(--os-toolbar-control-height, 1.65rem);
  padding-top: 0;
  padding-bottom: 0;
}

body.os-touch-layout .os-module-toolbar .form-select,
body.os-touch-layout .os-module-toolbar .module-main-filter-select,
body.os-touch-layout .os-module-toolbar .prs-station-select {
  height: 1.85rem;
  max-height: 1.85rem;
}

body.os-touch-layout .navbar .nav-link,
body.os-touch-layout .navbar .btn-link.nav-link {
  min-height: var(--os-touch-target-min);
  display: inline-flex;
  align-items: center;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

/* Touchscreens (phones, tablets, touch laptops): larger tap targets in content areas. */
body.os-coarse-pointer .module-main-group-toggle,
body.os-coarse-pointer .module-main-section-trigger,
body.os-coarse-pointer .module-main-btn,
body.os-coarse-pointer .prs-ribbon-btn,
body.os-coarse-pointer .module-main-filter-toggle,
body.os-coarse-pointer .module-main-plot-chip {
  min-height: var(--os-touch-target-min);
}

body.os-coarse-pointer .module-main-group-toggle,
body.os-coarse-pointer .module-main-section-trigger {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

body.os-coarse-pointer .module-main-btn,
body.os-coarse-pointer .prs-ribbon-btn {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

/* Fine pointer desktop/laptop: keep compact controls. */
@media (pointer: fine) and (min-width: 992px) {
  body:not(.os-coarse-pointer) .module-main-group-toggle,
  body:not(.os-coarse-pointer) .module-main-section-trigger,
  body:not(.os-coarse-pointer) .module-main-btn,
  body:not(.os-coarse-pointer) .prs-ribbon-btn {
    min-height: 0;
  }
}

/* Narrow screens — keep chrome horizontal + scrollable project-wide */
@media (max-width: 991.98px) {
  .os-page-gutter {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  /* App top nav: single row with sideways scroll instead of wrapping tall. */
  .os-app-header .os-app-navbar-inner,
  .os-app-header .navbar-collapse.collapse.show,
  .os-app-header .navbar-nav {
    flex-wrap: nowrap;
  }

  .os-app-header .navbar-collapse {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .os-app-header .navbar-nav .nav-link {
    white-space: nowrap;
  }

  /* Farm/Station/Settings module filter bar */
  .os-module-toolbar .module-main-filter-form,
  .os-module-toolbar .prs-station-form {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    row-gap: 0;
    column-gap: 0.75rem;
    width: 100%;
    max-width: none;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .os-module-toolbar .module-main-filter-field {
    flex: 0 0 auto;
    min-width: 0;
    max-width: none;
  }

  .os-module-toolbar .module-main-filter-field + .module-main-filter-field {
    border-left: 1px solid var(--os-module-header-border, rgba(255, 255, 255, 0.35));
    padding-left: 0.75rem;
  }

  .os-module-toolbar .module-main-filter-field--plots {
    flex: 0 1 auto;
    min-width: 8rem;
    max-width: min(18rem, 55vw);
    border-top: none;
    padding-top: 0;
    margin-top: 0;
  }

  .os-module-aps .os-module-toolbar .module-main-filter-field--plots {
    border-top: none;
  }

  /* All page toolbars: one scrollable row */
  .os-page-toolbar,
  .os-page-toolbar.os-page-toolbar-layout,
  .plan-toolbar-primary.os-page-toolbar,
  .plan-toolbar-secondary,
  .rotation-toolbar .os-page-toolbar {
    flex-wrap: nowrap !important;
    row-gap: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  /* Page header chrome stays one row (tools | title | search) */
  .os-page-header-chrome {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    grid-template-rows: auto;
    grid-template-areas: none;
    gap: 0.45rem;
    align-items: center;
  }

  .os-page-header-chrome-left {
    grid-column: 1;
    grid-row: 1;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .os-page-header-chrome-center {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
    max-width: min(16rem, 36vw);
  }

  .os-page-header-chrome-center > h1,
  .os-page-header-chrome-center > .h3 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    font-size: 1.05rem;
  }

  .os-page-header-chrome-right {
    grid-column: 3;
    grid-row: 1;
    justify-content: flex-end;
    min-width: 0;
  }

  .os-page-header-chrome-right .os-page-grid-search {
    flex: 0 1 9rem;
    max-width: 9rem;
    min-width: 5.5rem;
  }

  /* Title + toolbar hosts: keep row, allow sideways scroll */
  .os-desktop-page-header,
  .os-page-sticky-chrome,
  main .d-flex.justify-content-between.align-items-center.mb-3:has(.os-page-toolbar),
  main .d-flex.justify-content-between.align-items-center.mb-4:has(.os-page-toolbar),
  .plan-toolbar.os-desktop-page-header,
  .rotation-toolbar {
    flex-wrap: nowrap !important;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
  }

  .plan-toolbar-primary,
  .plan-toolbar-secondary {
    width: auto;
    max-width: 100%;
  }

  /* Bootstrap filter rows (balance / diary / invoices / etc.): keep horizontal */
  .os-page-sticky-chrome form.row,
  .os-desktop-page-header form.row,
  .os-app-main form.row.g-2.align-items-end,
  .os-app-main form.row.g-2.align-items-center,
  .ags-balance-page form.row,
  .prs-balance-page form.row,
  .prs-page form.row.g-2 {
    flex-wrap: nowrap !important;
    align-items: flex-end;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    row-gap: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .os-page-sticky-chrome form.row > [class*="col-"],
  .os-desktop-page-header form.row > [class*="col-"],
  .os-app-main form.row.g-2.align-items-end > [class*="col-"],
  .os-app-main form.row.g-2.align-items-center > [class*="col-"],
  .ags-balance-page form.row > [class*="col-"],
  .prs-balance-page form.row > [class*="col-"],
  .prs-page form.row.g-2 > [class*="col-"] {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    padding-left: 0.35rem;
    padding-right: 0.35rem;
  }

  .os-page-sticky-chrome form.row .form-select,
  .os-page-sticky-chrome form.row .form-control,
  .os-desktop-page-header form.row .form-select,
  .os-desktop-page-header form.row .form-control,
  .os-app-main form.row.g-2 .form-select,
  .os-app-main form.row.g-2 .form-control {
    min-width: 6.5rem;
    width: auto;
    max-width: 12rem;
  }

  /* Report filter forms (Comm, etc.): wrap fields instead of sideways scroll. */
  .os-report-filter-form,
  .os-page-sticky-chrome .os-report-filter-form,
  .os-app-main .os-report-filter-form {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    row-gap: 0.65rem;
  }

  .os-report-filter-form > [class*="col-"],
  .os-page-sticky-chrome .os-report-filter-form > [class*="col-"],
  .os-app-main .os-report-filter-form > [class*="col-"] {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
  }

  .os-report-filter-form > .col-md-2,
  .os-report-filter-form > .col-md-1,
  .os-report-filter-form > .col-auto {
    flex: 1 1 calc(50% - 0.35rem);
    width: calc(50% - 0.35rem);
    max-width: calc(50% - 0.35rem);
  }

  .os-report-filter-form .form-control,
  .os-report-filter-form .form-select {
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }

  .plan-grids-row {
    flex-direction: row;
    flex-wrap: nowrap;
    min-height: 560px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .plan-grid-panel,
  .plan-grid-panel-prev,
  .plan-grid-panel-current {
    flex: 0 0 auto;
    width: auto;
    min-height: 280px;
  }

  .plan-grid-panel-prev {
    flex: 0 0 25%;
    min-width: 12rem;
  }

  .plan-grid-panel-current {
    flex: 1 0 75%;
    min-width: 18rem;
  }

  .plan-grid-panel {
    border-right: 1px solid #bdbdbd;
    border-bottom: none;
  }

  .plan-grid-panel:last-child {
    border-bottom: none;
  }
}

/* Very narrow viewports: allow header title on its own line (portrait and landscape). */
@media (max-width: 575.98px) {
  .os-page-header-chrome {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "left right"
      "center center";
    row-gap: 0.35rem;
  }

  .os-page-header-chrome-left {
    grid-area: left;
  }

  .os-page-header-chrome-center {
    grid-area: center;
    grid-column: auto;
    justify-self: stretch;
    max-width: none;
  }

  .os-page-header-chrome-right {
    grid-area: right;
    grid-column: auto;
  }

  .os-page-header-chrome-center > h1,
  .os-page-header-chrome-center > .h3 {
    white-space: normal;
  }
}

@media (max-width: 767.98px) {
  .module-main-sidebar,
  .prs-sidebar {
    max-height: none;
    flex: 0 0 auto;
  }

  .module-main-group-nav,
  .prs-group-nav {
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: stretch;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    max-height: none;
  }

  .module-main-group-toggle,
  .module-main-section-trigger,
  .module-main-group-trigger,
  .prs-group-trigger {
    min-height: var(--os-touch-target-min);
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    flex: 1 1 auto;
    width: 100%;
  }

  .module-main-group-panels,
  .prs-group-panels {
    overflow-x: auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .module-main-section-row,
  .prs-section-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
  }

  .module-main-btn,
  .prs-ribbon-btn {
    min-height: var(--os-touch-target-min);
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .module-main-section,
  .prs-ribbon-section {
    flex: 0 0 13.5rem;
    width: 13.5rem;
    min-width: 13.5rem;
    max-width: 13.5rem;
  }

  .module-main-plot-chip {
    min-height: 2rem;
    padding: 0.35rem 0.65rem;
  }

  .os-desktop-page-header,
  main .d-flex.justify-content-between.align-items-center.mb-3,
  main .d-flex.justify-content-between.align-items-center.mb-4 {
    padding: 0.5rem 0.65rem;
  }

  .os-page-toolbar .os-page-toolbar-btn,
  .os-page-toolbar a.os-page-toolbar-btn,
  .os-page-toolbar a.btn,
  .os-page-toolbar button.btn {
    min-width: var(--os-touch-target-min);
  }

  .os-page-grid-search .dx-texteditor {
    width: 100% !important;
    max-width: 100%;
  }

  .os-page-header-chrome-right .os-page-grid-search {
    width: auto;
    max-width: 9rem;
    flex: 0 1 9rem;
  }

  .dx-datagrid .dx-datagrid-rowsview .dx-row > td,
  .dx-datagrid .dx-datagrid-filter-row .dx-editor-cell .dx-texteditor,
  .dx-datagrid .dx-datagrid-headers .dx-header-row > td {
    touch-action: manipulation;
  }

  body.os-touch-layout .dx-datagrid-rowsview .dx-row > td {
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
  }

  body.os-touch-layout .dx-datagrid .dx-datagrid-pager .dx-page,
  body.os-touch-layout .dx-datagrid .dx-datagrid-pager .dx-navigate-button,
  body.os-touch-layout .dx-datagrid .dx-datagrid-pager .dx-page-size {
    min-width: var(--os-touch-target-min);
    min-height: var(--os-touch-target-min);
    line-height: var(--os-touch-target-min);
  }

  .dropdown-menu .dropdown-item {
    min-height: var(--os-touch-target-min);
    display: flex;
    align-items: center;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .os-report-viewer-header .os-page-header-chrome-center > h1,
  .os-report-viewer-header .os-page-header-chrome-center > .h3 {
    font-size: 1rem;
  }
}

/* Phones: stack module hub sidebar above content for easier touch use. */
@media (max-width: 575.98px) {
  .module-main-layout,
  .prs-main-layout {
    flex-direction: column;
    width: 100%;
    overflow-x: auto;
    overflow-y: auto;
  }

  .module-main-sidebar,
  .prs-sidebar {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    border-right: none;
    border-bottom: 1px solid #ced4da;
  }

  .module-main-group-nav,
  .prs-group-nav {
    max-height: min(42vh, 22rem);
  }

  .module-main-group-panels,
  .prs-group-panels {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: auto;
    overflow-y: auto;
  }
}

/* Touch devices: larger report viewer toolbar controls */
@media (pointer: coarse), (max-width: 767.98px) {
  #DocumentViewer {
    --os-dxrd-toolbar-height: 48px;
    --os-dxrd-toolbar-icon-box: 28px;
    --os-dxrd-toolbar-icon-glyph: 18px;
    --os-dxrd-toolbar-control-height: 32px;
  }

  #DocumentViewer .dxrd-preview.dxrd-designer-wrapper .dxrd-right-tabs {
    width: 44px;
  }

  #DocumentViewer .dxrd-preview.dxrd-designer-wrapper .dxrd-right-panel.dxrd-tab-panel-right {
    right: 44px;
  }

  #DocumentViewer .dxrd-preview.dxrd-designer-wrapper .dxrd-right-tabs .dxrd-image-padding {
    width: 44px;
    height: 44px;
    background-size: 20px 20px;
  }

  #DocumentViewer .dxrd-preview.dxrd-designer-wrapper .dxrd-right-tabs .dxrd-image-padding svg {
    width: 20px;
    height: 20px;
  }
}

/* Portrait / narrow: unlock vertical and horizontal scroll on every page when content overflows. */
@media (orientation: portrait), (max-aspect-ratio: 1/1), (max-width: 991.98px) {
  html,
  html.os-ui-scaled,
  html:has(body.login-shell),
  html:has(body.os-app-shell:not(.login-shell)),
  html:has(body.os-app-body .module-main-page) {
    height: auto;
    min-height: 100%;
    max-height: none;
    overflow-x: scroll;
    overflow-y: scroll;
  }

  body,
  body.login-shell,
  body.os-app-shell:not(.login-shell),
  body.os-app-body:has(.module-main-page) {
    height: auto;
    min-height: 100dvh;
    max-height: none;
    overflow-x: auto;
    overflow-y: auto;
  }

  body.login-shell > .login-branded-layout,
  body.login-shell.login-shell-scrollable > .login-branded-layout,
  body.login-shell:has(.login-marketing-shell) > .login-branded-layout {
    overflow-x: auto;
    overflow-y: visible;
    min-height: min-content;
  }

  body.os-app-shell:not(.login-shell) > .container-fluid,
  body.os-app-body:has(.module-main-page) > .container-fluid {
    overflow-x: auto;
    overflow-y: auto;
    flex: 1 0 auto;
    max-height: none;
  }

  body.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main,
  body.os-app-body:has(.module-main-page) > .container-fluid > .os-app-main {
    overflow-x: auto;
    overflow-y: auto;
    flex: 1 0 auto;
    min-height: auto;
    max-height: none;
  }

  body.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main:has(.os-page-scroll .os-page-grid-view),
  body.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main:has(.os-page-scroll .os-page-table-view) {
    overflow-x: auto;
    overflow-y: auto;
  }

  body.os-app-shell:not(.login-shell) .os-app-main > :only-child:not(.os-page-sticky-chrome):not(.os-page-scroll):has(> .os-page-scroll),
  body.os-app-shell:not(.login-shell) .os-app-main > [class*="-index-page"]:not(.module-main-page):has(> .os-page-scroll),
  body.os-app-shell:not(.login-shell) .os-app-main > .rotation-page:has(> .os-page-scroll),
  body.os-app-shell:not(.login-shell) .os-app-main > *:not(.os-page-sticky-chrome):not(.os-page-scroll):has(> .os-page-scroll),
  body.os-app-shell:not(.login-shell) .os-app-main > :only-child[class*="-edit-page"]:has(> .os-page-scroll) {
    overflow-x: auto;
    overflow-y: auto;
    min-height: auto;
  }

  body.os-app-shell:not(.login-shell) .os-page-scroll,
  body.os-app-shell:not(.login-shell) .os-page-scroll:has(.os-page-grid-view),
  body.os-app-shell:not(.login-shell) .os-page-scroll:has(.os-page-table-view),
  body.os-app-shell:not(.login-shell) [class*="-edit-page"] > .os-page-scroll {
    display: block;
    overflow-x: auto;
    overflow-y: auto;
    min-height: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.os-app-shell:not(.login-shell) .os-page-grid-view {
    min-height: 320px;
    height: min(58vh, 720px);
    overflow-x: auto;
    overflow-y: auto;
  }

  body.os-app-shell:not(.login-shell) .os-page-grid-view .dx-datagrid {
    height: min(58vh, 720px) !important;
    min-height: 320px;
  }

  .module-main-page,
  .module-main-page > .module-main-layout,
  .module-main-layout,
  .prs-main-layout {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: auto;
    min-height: auto;
  }

  .module-main-sidebar,
  .prs-sidebar {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    border-right: none;
    border-bottom: 1px solid #ced4da;
  }

  .module-main-group-nav,
  .prs-group-nav {
    max-height: none;
    overflow-x: auto;
    overflow-y: auto;
  }

  .module-main-group-panels,
  .prs-group-panels {
    flex: 0 0 auto;
    width: 100%;
    min-height: auto;
    overflow-x: auto;
    overflow-y: auto;
  }

  .module-main-section-row,
  .prs-section-row {
    flex-wrap: wrap;
    overflow-x: auto;
    overflow-y: auto;
    gap: 0.65rem;
  }

  .module-main-section,
  .prs-ribbon-section {
    flex: 1 1 calc(50% - 0.35rem);
    width: auto;
    min-width: 11rem;
    max-width: none;
  }

  .os-module-toolbar-inner {
    flex-wrap: wrap !important;
    align-items: stretch;
    row-gap: 0.35rem;
    overflow-x: auto;
    overflow-y: visible;
    height: auto;
    max-height: none;
  }

  .os-module-toolbar-inner > .module-main-filter-form,
  .os-module-toolbar-inner > .prs-station-form {
    flex: 1 1 100% !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  .os-module-toolbar,
  .os-app-header {
    overflow: visible;
    height: auto;
    max-height: none;
  }

  .os-module-toolbar .os-app-page-toolbar-slot {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    flex-wrap: wrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    justify-content: flex-start !important;
  }

  .os-module-toolbar .os-app-page-toolbar-slot .os-app-merged-toolbar,
  .os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar {
    flex-wrap: wrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.os-app-shell:not(.login-shell) main .os-page-sticky-chrome:not(.site-cert-sticky-header) {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    flex-wrap: wrap !important;
  }

  body.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main:has(.os-page-sticky-chrome) {
    padding-top: 0 !important;
  }

  /* Override page-specific viewport locks so portrait can scroll. */
  html:has(body.os-app-body [class*="-page"]),
  html:has(body.os-app-body .module-main-page) {
    height: auto !important;
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
  }

  body.os-app-body:has([class*="-page"]),
  body.os-app-body:has(.module-main-page) {
    height: auto !important;
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
  }

  body.os-app-body > .container-fluid,
  body.os-app-body > .container-fluid > .os-app-main,
  body.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main > *,
  body.os-app-shell:not(.login-shell) .os-app-main > :only-child.ags-export-invoice-edit-page,
  body.os-app-shell:not(.login-shell) .os-app-main > :only-child[class*="-edit-page"],
  body.os-app-shell:not(.login-shell) .os-app-main > :only-child[class*="-index-page"],
  .ags-export-invoice-edit-page,
  .ags-fertigation-edit-page,
  .ags-harvest-edit-page,
  .ags-protection-edit-page,
  .prs-export-order-edit-page,
  .aps-qcap-protocol-page,
  .aps-qcap-protocol-edit-page,
  .ags-balance-page,
  .prs-balance-page,
  .prs-page,
  .ags-plan-page,
  .rotation-page {
    overflow-x: auto !important;
    overflow-y: auto !important;
    max-height: none !important;
    min-height: auto;
  }

  .os-app-page-toolbar-slot {
    flex: 1 1 100%;
    max-width: 100%;
    width: 100%;
    margin-left: 0;
    overflow-x: auto;
    overflow-y: visible;
  }

  .os-page-toolbar,
  .os-page-toolbar.os-page-toolbar-layout,
  .plan-toolbar-primary.os-page-toolbar,
  .plan-toolbar-secondary,
  .rotation-toolbar .os-page-toolbar,
  .os-desktop-page-header,
  .os-page-sticky-chrome,
  .plan-toolbar.os-desktop-page-header,
  .rotation-toolbar {
    flex-wrap: wrap !important;
    row-gap: 0.35rem;
    overflow-x: auto;
    overflow-y: visible;
  }

  .os-page-sticky-chrome form.row,
  .os-desktop-page-header form.row,
  .os-app-main form.row.g-2.align-items-end,
  .os-app-main form.row.g-2.align-items-center,
  .ags-balance-page form.row,
  .prs-balance-page form.row,
  .prs-page form.row.g-2 {
    flex-wrap: wrap !important;
    overflow-x: visible;
    overflow-y: visible;
    row-gap: 0.35rem;
  }

  .os-report-filter-form,
  .os-page-sticky-chrome .os-report-filter-form,
  .os-app-main .os-report-filter-form {
    overflow-x: visible !important;
  }

  .plan-grids-row {
    flex-direction: column;
    min-height: auto;
    overflow-x: auto;
    overflow-y: visible;
  }

  .plan-grid-panel,
  .plan-grid-panel-prev,
  .plan-grid-panel-current {
    flex: 0 0 auto;
    width: 100%;
    min-width: 0;
  }

  .plan-grid-panel {
    border-right: none;
    border-bottom: 1px solid #bdbdbd;
  }

  .plan-grid-panel:last-child {
    border-bottom: none;
  }

  .plan-grid-panel > [id$="-grid"] {
    min-height: 280px;
    height: min(50vh, 520px);
  }

  .os-page-header-chrome {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "left right"
      "center center";
    row-gap: 0.35rem;
  }

  .os-page-header-chrome-left {
    grid-area: left;
    overflow-x: auto;
    overflow-y: visible;
  }

  .os-page-header-chrome-center {
    grid-area: center;
    grid-column: auto;
    justify-self: stretch;
    max-width: none;
  }

  .os-page-header-chrome-right {
    grid-area: right;
    grid-column: auto;
  }

  .os-page-header-chrome-center > h1,
  .os-page-header-chrome-center > .h3 {
    white-space: normal;
    max-width: none;
  }

  .rotation-page,
  .ags-plan-page,
  .plan-page,
  .os-page-table-view,
  [class*="-edit-page"],
  [class*="-index-page"] {
    overflow-x: auto;
    overflow-y: auto;
    min-height: auto;
  }

  .ags-export-invoice-edit-page .os-page-toolbar,
  .ags-export-invoice-edit-page .os-desktop-page-header:has(.os-page-toolbar) {
    flex-wrap: wrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  .ags-export-invoice-edit-page .os-desktop-page-header > h1,
  .ags-export-invoice-edit-page .os-desktop-page-header > .h3 {
    max-width: none;
    white-space: normal;
  }

  /* Export Invoice Edit: stack all panels vertically and allow page scroll. */
  body.os-app-body:has(.ags-export-invoice-edit-page) > .container-fluid > .os-app-main,
  body.os-app-shell:not(.login-shell) .os-app-main > :only-child.ags-export-invoice-edit-page {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    min-height: auto !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  .ags-export-invoice-edit-page,
  .ags-export-invoice-edit-page .ags-export-invoice-form {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    min-height: auto !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-layout {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    height: auto !important;
    overflow: visible !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-layout > [class*="col-"] {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-products-section {
    display: block !important;
    flex: none !important;
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-details-panel {
    flex: none !important;
    min-height: 280px !important;
    height: auto !important;
    max-height: none !important;
    overflow: auto !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-details-panel,
  .ags-export-invoice-edit-page .ags-export-invoice-details-panel .dx-datagrid,
  .ags-export-invoice-edit-page .ags-export-invoice-balance-panel .dx-datagrid,
  .ags-export-invoice-edit-page .ags-export-invoice-balance-panel .dx-datagrid-rowsview,
  .ags-export-invoice-edit-page .ags-export-invoice-balance-panel .dx-datagrid-headers {
    overflow-x: auto !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-details-panel .dx-datagrid-rowsview,
  .ags-export-invoice-edit-page .ags-export-invoice-details-panel .dx-datagrid-headers {
    overflow-x: auto !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-details-panel .dx-scrollable-scrollbar-horizontal,
  .ags-export-invoice-edit-page .ags-export-invoice-balance-panel .dx-scrollable-scrollbar-horizontal {
    display: block !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-footer-fields {
    grid-template-columns: 1fr !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-header-grid .field-row-split {
    grid-template-columns: 1fr !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-header-grid .field-row-split .field {
    border-right: none !important;
    border-bottom: 1px solid #c8c8c8;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-header-grid .field-row-split .field:last-child {
    border-bottom: none;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-header-grid .field-firm-cb-combined {
    grid-template-columns: var(--ags-export-invoice-label-width, 100px) minmax(0, 1fr) !important;
  }

  /* Other viewport-locked edit pages: use document scroll in portrait. */
  body.os-app-shell:not(.login-shell) .os-app-main > :only-child[class*="-edit-page"] {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    min-height: auto !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  body.os-app-body:has(.rotation-page) > .container-fluid > .os-app-main,
  body.os-app-body:has(.ags-plan-page) > .container-fluid > .os-app-main {
    overflow-x: auto;
    overflow-y: auto;
  }

  body.os-app-shell:has(.os-report-viewer-page) > .container-fluid > .os-app-main,
  .os-report-viewer-page {
    overflow-x: auto;
    overflow-y: auto;
    min-height: auto;
  }

  .os-report-viewer-page #DocumentViewer {
    min-height: 320px;
    height: min(70vh, 900px) !important;
  }
}

/* Mirror portrait scroll rules when JS sets body.os-portrait-layout. */
body.os-portrait-layout:not(.login-shell) {
  overflow-x: auto;
  overflow-y: visible;
  height: auto;
  min-height: 100dvh;
  max-height: none;
}

html:has(body.os-portrait-layout:not(.login-shell)) {
  height: auto;
  min-height: 100%;
  max-height: none;
  overflow-x: scroll;
  overflow-y: scroll;
}

body.os-portrait-layout.login-shell:not(.login-shell-scrollable):not(:has(.login-marketing-shell)):not(:has(.login-cert-footer)) > .login-branded-layout {
  overflow-x: clip;
  overflow-y: auto;
  min-height: 0;
  max-height: calc(100dvh - 24px);
}

/* Welcome page: cert footer pinned to viewport bottom, card centered above it. */
body.os-portrait-layout.login-shell:has(.login-cert-footer),
body.login-shell:has(.login-cert-footer) {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 100dvh !important;
  overflow-x: clip !important;
  overflow-y: hidden !important;
}

html:has(body.login-shell:has(.login-cert-footer)),
html:has(body.os-portrait-layout.login-shell:has(.login-cert-footer)) {
  height: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

body.os-portrait-layout.login-shell:has(.login-cert-footer) > .login-branded-layout,
body.login-shell:has(.login-cert-footer) > .login-branded-layout {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  justify-content: center;
  overflow-x: clip;
  overflow-y: auto;
}

body.os-portrait-layout.login-shell:has(.login-cert-footer) > .login-cert-footer,
body.login-shell:has(.login-cert-footer) > .login-cert-footer {
  flex: 0 0 auto;
  align-self: stretch;
  width: auto;
  margin-top: auto;
  margin-bottom: 0;
  z-index: 20;
}

body.login-shell.login-shell-scrollable:has(.login-cert-footer) > .login-branded-layout,
body.login-shell:has(.login-marketing-shell):has(.login-cert-footer) > .login-branded-layout,
body.os-portrait-layout.login-shell.login-shell-scrollable:has(.login-cert-footer) > .login-branded-layout,
body.os-portrait-layout.login-shell:has(.login-marketing-shell):has(.login-cert-footer) > .login-branded-layout {
  overflow-x: clip !important;
  overflow-y: auto !important;
  justify-content: flex-start;
  min-height: 0;
}

body.os-portrait-layout.login-shell.login-shell-scrollable > .login-branded-layout,
body.os-portrait-layout.login-shell:has(.login-marketing-shell) > .login-branded-layout {
  overflow-x: clip;
  overflow-y: auto;
  min-height: 0;
}

body.os-portrait-layout.os-app-shell:not(.login-shell) > .container-fluid,
body.os-portrait-layout.os-app-body:has(.module-main-page) > .container-fluid {
  overflow-x: auto;
  overflow-y: auto;
  max-height: none;
}

body.os-portrait-layout.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main,
body.os-portrait-layout.os-app-body:has(.module-main-page) > .container-fluid > .os-app-main {
  overflow-x: auto;
  overflow-y: auto;
  max-height: none;
  min-height: auto;
}

body.os-portrait-layout.os-app-shell:not(.login-shell) .os-page-scroll,
body.os-portrait-layout.os-app-shell:not(.login-shell) .os-page-scroll:has(.os-page-grid-view),
body.os-portrait-layout.os-app-shell:not(.login-shell) .os-page-scroll:has(.os-page-table-view) {
  overflow-x: auto;
  overflow-y: auto;
  min-height: auto;
}

body.os-portrait-layout .module-main-page,
body.os-portrait-layout .module-main-layout,
body.os-portrait-layout .prs-main-layout,
body.os-portrait-layout .module-main-group-panels,
body.os-portrait-layout .prs-group-panels {
  overflow-x: auto;
  overflow-y: auto;
  min-height: auto;
}

body.os-portrait-layout.os-app-shell:has(.os-report-viewer-page) > .container-fluid > .os-app-main,
body.os-portrait-layout .os-report-viewer-page {
  overflow-x: auto;
  overflow-y: auto;
  min-height: auto;
}

/* Portrait / os-portrait-layout: keep header toolbars and page controls visible. */
body.os-portrait-layout .os-app-header,
body.os-portrait-layout .os-module-toolbar,
body.os-portrait-layout .os-module-toolbar-inner {
  overflow: visible;
  height: auto;
  max-height: none;
}

body.os-portrait-layout .os-module-toolbar-inner {
  flex-wrap: wrap !important;
  align-items: stretch;
  row-gap: 0.35rem;
  overflow-x: auto;
  overflow-y: visible;
}

body.os-portrait-layout .os-module-toolbar-inner > .module-main-filter-form,
body.os-portrait-layout .os-module-toolbar-inner > .prs-station-form {
  flex: 1 1 100% !important;
  max-width: 100% !important;
  flex-wrap: wrap !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body.os-portrait-layout .os-module-toolbar .os-app-page-toolbar-slot {
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  flex-wrap: wrap !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  justify-content: flex-start !important;
}

body.os-portrait-layout .os-module-toolbar .os-app-page-toolbar-slot .os-app-merged-toolbar,
body.os-portrait-layout .os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar,
body.os-portrait-layout .os-page-toolbar,
body.os-portrait-layout .os-page-sticky-chrome,
body.os-portrait-layout .os-desktop-page-header {
  flex-wrap: wrap !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body.os-portrait-layout.os-app-shell:not(.login-shell) main .os-page-sticky-chrome:not(.site-cert-sticky-header) {
  position: static !important;
  top: auto !important;
}

body.os-portrait-layout.os-app-body > .container-fluid,
body.os-portrait-layout.os-app-body > .container-fluid > .os-app-main,
body.os-portrait-layout.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main > *,
body.os-portrait-layout .ags-export-invoice-edit-page,
body.os-portrait-layout [class*="-edit-page"],
body.os-portrait-layout [class*="-index-page"],
body.os-portrait-layout .ags-balance-page,
body.os-portrait-layout .prs-balance-page,
body.os-portrait-layout .prs-page,
body.os-portrait-layout .ags-plan-page,
body.os-portrait-layout .rotation-page,
body.os-portrait-layout .module-main-page {
  overflow-x: auto !important;
  overflow-y: auto !important;
  max-height: none !important;
  min-height: auto;
}

body.os-portrait-layout.os-app-body,
body.os-portrait-layout.os-app-shell:not(.login-shell) {
  height: auto !important;
  max-height: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

html:has(body.os-portrait-layout:not(.login-shell)) {
  height: auto !important;
  max-height: none !important;
  overflow-x: scroll !important;
  overflow-y: scroll !important;
}

body.os-portrait-layout .ags-export-invoice-edit-page,
body.os-portrait-layout .ags-export-invoice-edit-page .ags-export-invoice-form {
  display: block !important;
  height: auto !important;
  max-height: none !important;
  min-height: auto !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body.os-portrait-layout .ags-export-invoice-edit-page .ags-export-invoice-layout {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body.os-portrait-layout .ags-export-invoice-edit-page .ags-export-invoice-layout > [class*="col-"] {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
}

body.os-portrait-layout .ags-export-invoice-edit-page .ags-export-invoice-products-section {
  display: block !important;
  flex: none !important;
  height: auto !important;
  min-height: auto !important;
  overflow: visible !important;
}

body.os-portrait-layout .ags-export-invoice-edit-page .ags-export-invoice-details-panel {
  min-height: 280px !important;
  height: auto !important;
  max-height: none !important;
  overflow: auto !important;
}

body.os-portrait-layout.os-app-shell:not(.login-shell) .os-app-main > :only-child[class*="-edit-page"] {
  display: block !important;
  height: auto !important;
  max-height: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

/* Login page: identical stacked layout in portrait and landscape. */
body.login-shell.login-shell-branded .login-side-toolbar {
  position: static;
  transform: none;
  flex-direction: row;
  flex-wrap: wrap;
}

body.login-shell.login-shell-branded .login-page-center,
body.login-shell.login-shell-branded .login-branded-layout {
  overflow-x: clip;
  overflow-y: visible;
}

body.login-shell.login-shell-branded:not(.login-shell-scrollable):not(:has(.login-marketing-shell)):not(:has(.login-cert-footer)) > .login-branded-layout {
  overflow-y: auto;
  max-height: calc(100dvh - 24px);
}

body.login-shell.login-shell-branded:not(.login-shell-scrollable):not(:has(.login-marketing-shell)):has(.login-cert-footer) > .login-branded-layout {
  overflow-y: auto;
  min-height: 0;
}

body.login-shell.login-shell-scrollable.login-shell-branded .login-page-center,
body.login-shell.login-shell-branded:has(.login-marketing-shell) .login-page-center {
  overflow: visible !important;
  max-height: none !important;
  justify-content: flex-start !important;
}

body.login-shell.login-shell-scrollable.login-shell-branded .login-branded-layout,
body.login-shell.login-shell-branded:has(.login-marketing-shell) .login-branded-layout {
  overflow-x: clip;
  overflow-y: auto;
  justify-content: flex-start;
}

@media (orientation: portrait) {
  body.login-shell.login-shell-branded:not(.login-shell-scrollable):not(:has(.login-marketing-shell)):not(:has(.login-cert-footer)) .login-page-center,
  body.login-shell.login-shell-branded:not(.login-shell-scrollable):not(:has(.login-marketing-shell)):not(:has(.login-cert-footer)) .login-branded-layout {
    overflow-x: clip;
    overflow-y: auto;
  }

  body.login-shell.login-shell-scrollable.login-shell-branded .login-page-center,
  body.login-shell.login-shell-branded:has(.login-marketing-shell) .login-page-center {
    overflow: visible !important;
    max-height: none !important;
    justify-content: flex-start !important;
  }

  body.login-shell.login-shell-scrollable.login-shell-branded .login-branded-layout,
  body.login-shell.login-shell-branded:has(.login-marketing-shell) .login-branded-layout {
    overflow-x: clip;
    overflow-y: auto;
    justify-content: flex-start;
  }
}

/* Portrait: document scroll for the full app shell and all locked edit/index pages. */
html:has(body.os-portrait-layout:not(.login-shell):not(.os-export-invoice-portrait-scroll)),
html.os-ui-scaled:has(body.os-portrait-layout:not(.login-shell):not(.os-export-invoice-portrait-scroll)),
html.os-portrait-root:not(:has(body.login-shell)):not(:has(body.os-export-invoice-portrait-scroll)) {
  height: auto !important;
  max-height: none !important;
  overflow-x: scroll !important;
  overflow-y: scroll !important;
}

body.os-portrait-layout.os-app-body,
body.os-portrait-layout.os-app-shell:not(.login-shell) {
  height: auto !important;
  max-height: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  display: block !important;
}

body.os-portrait-layout.os-app-shell:not(.login-shell):not(.os-export-invoice-portrait-scroll) > .container-fluid,
body.os-portrait-layout.os-app-body:not(.os-export-invoice-portrait-scroll) > .container-fluid,
body.os-portrait-layout.os-app-shell:not(.login-shell):not(.os-export-invoice-portrait-scroll) > .container-fluid > .os-app-main,
body.os-portrait-layout.os-app-body:not(.os-export-invoice-portrait-scroll) > .container-fluid > .os-app-main {
  display: block !important;
  flex: none !important;
  height: auto !important;
  max-height: none !important;
  min-height: auto !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body.os-portrait-layout .ags-export-invoice-edit-page .ags-export-invoice-details-panel {
  min-height: 280px !important;
  height: auto !important;
  max-height: none !important;
  overflow: auto !important;
}

/* Portrait / narrow: force document-level vertical and horizontal scroll on every app page. */
@media (orientation: portrait), (max-aspect-ratio: 1/1), (max-width: 991.98px) {
  html:not(:has(body.login-shell)):not(:has(body.os-export-invoice-portrait-scroll)),
  html.os-portrait-root:not(:has(body.login-shell)):not(:has(body.os-export-invoice-portrait-scroll)) {
    height: auto !important;
    max-height: none !important;
    overflow-x: scroll !important;
    overflow-y: scroll !important;
  }

  body.os-app-shell:not(.login-shell):not(.os-export-invoice-portrait-scroll),
  body.os-app-body:not(.login-shell):not(.os-export-invoice-portrait-scroll),
  body.os-portrait-layout.os-app-shell:not(.login-shell):not(.os-export-invoice-portrait-scroll),
  body.os-portrait-layout.os-app-body:not(.os-export-invoice-portrait-scroll) {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    min-height: 100dvh !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  body.os-app-shell:not(.login-shell):not(.os-export-invoice-portrait-scroll) > .container-fluid,
  body.os-app-body:not(.os-export-invoice-portrait-scroll) > .container-fluid,
  body.os-app-shell:not(.login-shell):not(.os-export-invoice-portrait-scroll) > .container-fluid > .os-app-main,
  body.os-app-body:not(.os-export-invoice-portrait-scroll) > .container-fluid > .os-app-main {
    display: block !important;
    flex: none !important;
    height: auto !important;
    max-height: none !important;
    min-height: auto !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
  }

  body.os-app-shell:not(.login-shell) .os-app-main > *,
  body.os-app-shell:not(.login-shell) .os-app-main > :only-child,
  body.os-app-shell:not(.login-shell) [class*="-edit-page"],
  body.os-app-shell:not(.login-shell) [class*="-index-page"],
  body.os-app-shell:not(.login-shell) .module-main-page,
  body.os-app-shell:not(.login-shell) .ags-plan-page,
  body.os-app-shell:not(.login-shell) .rotation-page,
  body.os-app-shell:not(.login-shell) .ags-balance-page,
  body.os-app-shell:not(.login-shell) .prs-balance-page,
  body.os-app-shell:not(.login-shell) .prs-page,
  body.os-app-shell:not(.login-shell) .os-page-scroll,
  body.os-app-shell:not(.login-shell) .os-page-grid-view,
  body.os-app-shell:not(.login-shell) .os-page-table-view,
  body.os-app-shell:not(.login-shell) .plan-grids-row,
  body.os-app-shell:not(.login-shell) .module-main-layout,
  body.os-app-shell:not(.login-shell) .prs-main-layout {
    display: block !important;
    flex: none !important;
    height: auto !important;
    max-height: none !important;
    min-height: auto !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
  }

  .ags-export-invoice-edit-page,
  .ags-export-invoice-edit-page .ags-export-invoice-form,
  .ags-export-invoice-edit-page .ags-export-invoice-products-section,
  .ags-export-invoice-edit-page .ags-export-invoice-layout,
  .ags-export-invoice-edit-page .ags-export-invoice-layout.row {
    display: block !important;
    flex: none !important;
    height: auto !important;
    max-height: none !important;
    min-height: auto !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-layout,
  .ags-export-invoice-edit-page .ags-export-invoice-layout.row {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-layout > [class*="col-"] {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: min-content !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-list-panel,
  .ags-export-invoice-edit-page .ags-export-invoice-balance-panel,
  .ags-export-invoice-edit-page .ags-export-invoice-header-grid,
  .ags-export-invoice-edit-page .ags-export-invoice-details-panel,
  .ags-export-invoice-edit-page .ags-export-invoice-footer-fields,
  .ags-export-invoice-edit-page .dx-datagrid,
  .ags-export-invoice-edit-page .dx-datagrid-rowsview,
  .ags-export-invoice-edit-page .dx-datagrid-headers,
  .ags-export-invoice-edit-page .dx-scrollable-content {
    overflow-x: auto !important;
    max-width: none !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-details-panel {
    min-height: 280px !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
  }

  /* Unlock clipped horizontal overflow from desktop layout rules. */
  body.os-app-shell:not(.login-shell) .dx-datagrid,
  body.os-app-shell:not(.login-shell) .dx-treelist,
  body.os-app-shell:not(.login-shell) .dx-datagrid-rowsview,
  body.os-app-shell:not(.login-shell) .dx-datagrid-headers,
  body.os-app-shell:not(.login-shell) .dx-scrollable-content,
  body.os-app-shell:not(.login-shell) .os-page-toolbar,
  body.os-app-shell:not(.login-shell) .os-page-sticky-chrome,
  body.os-app-shell:not(.login-shell) .os-desktop-page-header,
  body.os-app-shell:not(.login-shell) .os-page-header-chrome,
  body.os-app-shell:not(.login-shell) table.table {
    overflow-x: auto !important;
    max-width: none !important;
  }

  body.os-app-shell:not(.login-shell) .dx-scrollable-scrollbar-horizontal {
    display: block !important;
  }
}

/* Export Invoice Edit: dedicated vertical scroll region in portrait / narrow view. */
@media (orientation: portrait), (max-aspect-ratio: 1/1), (max-width: 991.98px) {
  body.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main:has(.ags-export-invoice-edit-page),
  body.os-app-body:has(.ags-export-invoice-edit-page) > .container-fluid > .os-app-main,
  .os-app-main.os-export-invoice-portrait-scroll-main {
    display: block !important;
    flex: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100dvh - var(--os-app-header-height, 56px) - var(--os-app-footer-height, 32px) - 0.35rem) !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  body.os-app-shell:not(.login-shell) .os-app-main > .ags-export-invoice-edit-page,
  body.os-app-shell:not(.login-shell) .os-app-main > :only-child.ags-export-invoice-edit-page,
  .ags-export-invoice-edit-page.os-export-invoice-portrait-scroll-page {
    display: block !important;
    flex: none !important;
    height: auto !important;
    min-height: min-content !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-form,
  .ags-export-invoice-edit-page .ags-export-invoice-layout,
  .ags-export-invoice-edit-page .ags-export-invoice-layout.row,
  .ags-export-invoice-edit-page .ags-export-invoice-products-section {
    display: block !important;
    flex: none !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .ags-export-invoice-edit-page .ags-export-invoice-layout,
  .ags-export-invoice-edit-page .ags-export-invoice-layout.row {
    display: flex !important;
    flex-direction: column !important;
  }
}

body.os-export-invoice-portrait-scroll.os-app-shell:not(.login-shell) > .container-fluid,
body.os-export-invoice-portrait-scroll.os-app-body > .container-fluid {
  display: block !important;
  flex: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

body.os-export-invoice-portrait-scroll.os-app-shell:not(.login-shell) > .container-fluid > .os-app-main,
body.os-export-invoice-portrait-scroll.os-app-body > .container-fluid > .os-app-main,
body.os-portrait-layout.os-export-invoice-portrait-scroll > .container-fluid > .os-app-main {
  max-height: calc(100dvh - var(--os-app-header-height, 56px) - var(--os-app-footer-height, 32px) - 0.35rem) !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

html:has(body.os-export-invoice-portrait-scroll),
html.os-portrait-root:has(body.os-export-invoice-portrait-scroll) {
  height: 100% !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
}

body.os-export-invoice-portrait-scroll,
body.os-export-invoice-portrait-scroll.os-app-body,
body.os-export-invoice-portrait-scroll.os-app-shell:not(.login-shell) {
  height: 100% !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.os-export-invoice-portrait-scroll > .container-fluid {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body.os-export-invoice-portrait-scroll .ags-export-invoice-edit-page,
body.os-export-invoice-portrait-scroll .ags-export-invoice-edit-page.os-export-invoice-portrait-scroll-page {
  overflow: visible !important;
}

/* ===== Force vertically centered column headers (beats DX Material padding/align) ===== */
.dx-datagrid .dx-datagrid-headers .dx-datagrid-content .dx-datagrid-table .dx-row.dx-header-row > td,
.dx-datagrid .dx-datagrid-headers .dx-datagrid-content .dx-datagrid-table .dx-row.dx-band-row > td,
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row.dx-header-row > td,
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row.dx-band-row > td,
.dx-datagrid-headers .dx-datagrid-content .dx-datagrid-table .dx-row.dx-header-row > td,
.dx-datagrid-headers .dx-datagrid-content .dx-datagrid-table .dx-row.dx-band-row > td,
.dx-datagrid-headers .dx-datagrid-table .dx-row.dx-header-row > td,
.dx-datagrid-headers .dx-datagrid-table .dx-row.dx-band-row > td,
.dx-datagrid-headers .dx-header-row > td,
.dx-datagrid-headers .dx-band-row > td,
.dx-datagrid-headers.dx-header-multi-row .dx-datagrid-content .dx-datagrid-table .dx-row.dx-header-row > td {
  vertical-align: middle !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0.35rem !important;
  padding-right: 0.35rem !important;
  height: var(--os-grid-header-row-height, 28px) !important;
  min-height: var(--os-grid-header-row-height, 28px) !important;
  max-height: var(--os-grid-header-row-height, 28px) !important;
  line-height: var(--os-grid-header-row-height, 28px) !important;
  font-size: var(--os-grid-header-font-size, 11px) !important;
  box-sizing: border-box !important;
}

.dx-datagrid .dx-datagrid-headers .dx-datagrid-content .dx-datagrid-table .dx-row.dx-header-row > td .dx-datagrid-text-content,
.dx-datagrid .dx-datagrid-headers .dx-datagrid-table .dx-row.dx-header-row > td .dx-datagrid-text-content,
.dx-datagrid-headers .dx-datagrid-content .dx-datagrid-table .dx-row.dx-header-row > td .dx-datagrid-text-content,
.dx-datagrid-headers .dx-datagrid-table .dx-row.dx-header-row > td .dx-datagrid-text-content,
.dx-datagrid-headers .dx-header-row > td .dx-datagrid-text-content,
.dx-datagrid-headers .dx-band-row > td .dx-datagrid-text-content {
  display: inline-block !important;
  vertical-align: middle !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  line-height: var(--os-grid-header-row-height, 28px) !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: inherit !important;
}

.dx-datagrid-headers .dx-header-row > td .dx-column-indicators:not(.dx-visibility-hidden),
.dx-datagrid-headers .dx-datagrid-table .dx-row.dx-header-row > td .dx-column-indicators:not(.dx-visibility-hidden) {
  position: absolute !important;
  inset-inline-end: 2px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  float: none !important;
}

.dx-datagrid-headers .dx-header-row > td:not(.dx-command-select):not(.dx-command-expand):not(.dx-command-adaptive):not(.dx-command-edit):has(.dx-column-indicators:not(.dx-visibility-hidden)),
.dx-datagrid-headers .dx-datagrid-table .dx-row.dx-header-row > td:not(.dx-command-select):not(.dx-command-expand):not(.dx-command-adaptive):not(.dx-command-edit):has(.dx-column-indicators:not(.dx-visibility-hidden)) {
  padding-inline-end: 1.7rem !important;
  padding-right: 1.7rem !important;
}

.dx-datagrid-headers .dx-header-row > td:not(.dx-command-select):not(.dx-command-expand):not(.dx-command-adaptive):not(.dx-command-edit):has(.dx-column-indicators:not(.dx-visibility-hidden) .dx-sort):has(.dx-column-indicators:not(.dx-visibility-hidden) .dx-header-filter),
.dx-datagrid-headers .dx-datagrid-table .dx-row.dx-header-row > td:not(.dx-command-select):not(.dx-command-expand):not(.dx-command-adaptive):not(.dx-command-edit):has(.dx-column-indicators:not(.dx-visibility-hidden) .dx-sort):has(.dx-column-indicators:not(.dx-visibility-hidden) .dx-header-filter) {
  padding-inline-end: 2.45rem !important;
  padding-right: 2.45rem !important;
}